javascript 面向对象编程 （1）
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了javascript 面向对象编程 （1），小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含8420字，纯文字阅读大概需要13分钟。
内容图文
1.理解global对象
- global对象是作为 window 对象的一部分实现的，我们无法通过代码访问到 global 对象。
- 我们平时在全局环境下定义的内容（变量，函数，常量等等）都是作为 global 对象的属性存在的（都属于 global 对象）
2.基本类型（原始类型）数据的存储方式
变量在存储原始类型的数据时，直接将数据存储到变量的内存空间中，
当我们将存储数据的变量赋值给另一个变量时，其实是将变量存储的数据复制了一份保存到另一个变量的内存空间中，
因为每个变量都是使用自己独立的存储空间保存原始类型的数据，因此我们改变其中一个变量空间中的数据时，不会影响到另一个变量
1 <body> 2 <script> 3 4 /* 5 变量在存储原始类型的数据时，直接将数据存储到变量的内容空间中。 6 */ 7 8 var color1 = 'red'; 9 10 /* 11 当我们将存储原始数据的变量赋值给另一个变量时，其实是将变量存储的数据复制了一份保存到了另一个变量的内存空间中。 12 */ 13 var color2 = color1; 14 15 /* 16 因为每个变量都是使用自己独立的存储空间保存原始类型的数据，因此我们改变其中一个变量空间中的数据时，不会影响到另一个变量。 17 */ 18 color1 = 'green'; 19 20 console.log(color1); // 'green' 21 console.log(color2); // 'red' 22 23 </script> 24 </body>
3.引用类型数据存储到方式
引用类型的数据并没有直接存储在变量的内存空间中，变量的内存空间中保存的仅仅是引用类型数据在内存中的地址。 当我们将一个引用类型的变量赋值给另一个变量时，实际上是将变量中保存的地址复制了一份给了另一个变量，这时两个变量都指向同一个对象。 因为两个变量引用的是同一个对象，此时，无论是哪个变量改变了对象的属性（fullName），都会影响到另一个变量。 ?
1 <body>
2 <script>
3
4 /*
5 引用类型的数据并没有直接存储在变量的内存空间中，变量的内存空间中保存的仅仅是引用类型数据在内存中的地址。
6
7 */
8 var obj1 = {
9 fullName: '常军辉'
10 };
11
12 /*
13 当我们将一个引用类型的变量赋值给另一个变量时，实际上是将变量中保存的地址复制了一份给了另一个变量，这时两个变量都指向同一个对象。
14 */
15 var obj2 = obj1;
16
17 /*
18 因为两个变量引用的是同一个对象，此时，无论是哪个变量改变了对象的属性（fullName），都会影响到另一个变量。
19
20 */
21
22 obj2.fullName = '孟天乐';
23
24 console.log(obj1.fullName); // '孟天乐'
25 console.log(obj2.fullName); // '孟天乐'
26
27 </script>
28 </body>
4.引用类型（复杂类型）的数据
1 <body>
2 <script>
3
4 // 引用类型数据指的就是各种对象。
5
6 /*
7 原生对象（本地对象）：独立于宿主环境由 ECMAScript 实现提供的对象。与宿主无关，在JavaScript（远景浏览器），jscript(IE浏览器)，Nodejs（Node运行平台）等等中均有这些对象。简单来说，本地对象就是 ECMA-262 提案中定义的对象（类），在运行过程中动态创建的对象，需要使用 new 操作符。例如，Object/Array/Date/Function/RegExp/String/Number/Boolean
8 */
9
10 /*
11 内置对象（内建对象）：由 ECMAScript 实现提供的，并且独立于宿主环境的对象，在 ECMASript 程序开始执行时出现，即在引擎初始化阶段就被创建好的对象。这意味着开发者不需要自己去实例化这些对象，它已经被实例化了。例如，global/Math
12 */
13
14 /*
15 宿主对象：由实现 ECMAScript 规范的宿主环境提供的对象，包含两大类：一类是宿主提供的，一类是开发者自定义的。ECMAScript 官方未定义的对象都属于宿主对象，所有非本地对象都是宿主对象。
16
17 function Dog() {
18
19 }
20 new Dog()
21
22 */
23
24 // 使用字面量或直接量的形式实例化对象
25 var obj = {
26 name: '刘逸云'
27 };
28
29 var arr = [1, 2, 3, 4];
30
31 function foo (x, y) {
32 return x + y;
33 }
34
35 var reg1 = /greeting/img;
36
37 // 使用构造函数的形式实例化对象
38 var obj = new Object();
39
40 var arr = new Array(1, 2, 3, 4);
41
42 var foo = new Function('x', 'y', 'return x + y');
43
44 var reg = new RegExp('greeting', 'img');
45
46 var date = new Date();
47
48 // 一下 3 种对象也被称为包装器对象
49 var strObj = new String('Hello World!')
50 var bolObj = new Boolean(false)
51 var numObj = new Number(123)
52
53 console.log(typeof str)
54 console.log(typeof strObj)
55
56 </script>
57 </body>
5.检测引用数据的类型
使用?instanceof?操作符检测引用数据的类型? instanceof?操作符的作用：判断一个对象是否是另一个对象的实例（也可以说成是判断一个对象是否是通过另一个对象创建的）。 1 <body>
2 <script>
3
4
5 // 使用构造函数的形式实例化对象
6 var obj = new Object();
7
8 var arr = new Array(1, 2, 3, 4);
9
10 var foo = new Function('x', 'y', 'return x + y');
11
12 var reg = new RegExp('greeting', 'img');
13
14 var date = new Date();
15
16 // 使用 instanceof 操作符检测引用数据的类型
17 // instanceof 操作符的作用：判断一个对象是否是另一个对象的实例（也可以说成是判断一个对象是否是通过另一个对象创建的）。
18
19 console.log(obj instanceof Object); // true
20 console.log(arr instanceof Array); // true
21 console.log(foo instanceof Function); // true
22 console.log(reg instanceof RegExp); // true
23 console.log(date instanceof Date); // true
24
25 // 以下两行返回的 false
26 console.log(arr instanceof Date); // false
27 console.log(obj instanceof Function); // false
28
29 </script>
30 </body>
6.操作对象的属性
添加属性：直接添加 obj.age= 20；
1 <body>
2 <script>
3
4 var obj1 = {
5 fullName: '苑文浩'
6 };
7
8 // 添加属性
9 obj1.age = 20;
10 obj1['gender'] = '男';
11
12 // 修改属性
13 obj1.fullName = '张尊娟';
14 obj1['gender'] = '女';
15
16 // 删除属性
17 delete obj1.age
18 delete obj1['gender']
19
20 // 判断对象中是否包含某个属性
21 console.log('age' in obj1); // false
22 console.log('fullName' in obj1); // true
23
24
25 console.log(obj1)
26
27 </script>
28 </body>
7.包装器对象
普通的字符串竟然可以当成?String?类型的对象去使用呢？ ?当我们将普通的字符串作为?String?类型的对象使用时，JS的解析引擎会自动地将普通的字符串临时转换成?String?类型的对象，这一过程也被称为自动包装包装之后的临时对象（temp）只存在于调用方法或属性的那一刹那，随后就被销毁了
- .split() 方法用于把一个字符串分割成字符串数组。
1 <body>
2 <script>
3
4 // Number
5 // String
6 // Boolean
7
8 var str1 = 'Hello World!';
9
10 console.log(typeof str1); // 'string'
11 console.log('str1' instanceof String); // false
12
13 // 普通的字符串竟然可以当成 String 类型的对象去使用呢？
14 // 当我们将普通的字符串作为 String 类型的对象使用时，JS的解析引擎会自动地将普通的字符串临时转换成 String 类型的对象，这一过程也被称为自动包装。
15 console.log(str1.length) // 12
16 console.log(str1.split(' ')); // ['Hello', 'World!']
17
18 // 我们可以使用如下的代码来解释自动包装的过程：
19
20 // var temp = new String(str1); // 临时将普通字符串包装成 String 类型的对象
21 // console.log(temp.length) // 使用对象的属性
22 // console.log(temp.split(' ')); // 使用对象的方法
23 // temp = null; // 销毁临时创建的对象
24
25 // 注意，包装之后的临时对象（temp）只存在于调用方法或属性的那一刹那，随后就被销毁了。
26
27 // var pi = 3.1415926;
28 // pi = new Number(pi)
29 // console.log(pi.toFixed(2))
30
31
32
33
34 </script>
35 </body>
8.包装器对象的其他方法
1 <body>
2 <script>
3
4 // Number
5 // String
6 // Boolean
7
8 // 在使用 new 操作符时，上面 3 个构造函数的作用是创建该对象的实例
9
10 var objStr = new String('Hello World!'); // 创建 String 对象的实例
11 var objNum = new Number(123223233); // 创建 Number 对象的实例
12 var objBol = new Boolean(true); // 创建 Boolean 对象的实例
13
14 console.log(objStr);
15 console.log(objNum);
16 console.log(objBol);
17
18 // 在不使用 new 操作符时，上面 3 个构造函数的作用是转换数据类型
19 var p1 = '3.1415926';
20 var p2 = 3.1415926;
21 var p3 = ' ';
22
23
24 console.log(Number(p1)); // 将字符串转换成数字
25 console.log(String(p2)); // 将数字转换成字符串
26 console.log(Boolean(p3)); // 将数字转换成布尔值
27
28 </script>
29 </body>
内容总结
以上是互联网集市为您收集整理的javascript 面向对象编程 （1）全部内容，希望文章能够帮你解决javascript 面向对象编程 （1）所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。
来源：【匿名】