JavaScript面向对象
本文主要学习Javascript的对象，对象的方法，如何遍历以及如何实现对象的深克隆
认识对象
对象（object）是“键值对”的集合，表示属性和值的映射 关系
//JS中，大括号表示对象var xiaoming = {name: '小明',//属性名（键名，key）；属性值（value）age: 12,sex: '男',hobbies: ['足球','编程']};对象的语法
k和v之间用冒号分隔，每组k
var obj = { k: v, k: v, k: v, k: v};属性是否加引号
如果对象的属性键名不符合JS标识符命名规范，则这个键名 必须用引号包裹
var xiaoming = { name: '小明', age: 12, sex: '男', hobbys: ['足球','游泳','编程'], 'favorite-book': '舒克和贝塔'//属性名中有短横，不符合JS标识符命名规范，属性名必须用引号包裹};属性的访问
可以用“点语法”访问对象中指定键的值
xiaoming.name; // '小明'xiaoming.age; // 12xiaoming.hobbys; // ['足球','游泳','编程']如果属性名不符合JS标识符命名规范，则必须用方括号的写 法来访问
xiaoming['favorite-book']; // '舒克和贝塔'；不符合标识符命名规范，就必须用方括号访问属性如果属性名以变量形式存储，则必须使用方括号形式
var obj = { a: 1, b: 2, c: 3};var key = 'b';console.log(obj.key);// undefinedconsole.log(obj[key]);// 2解释一下：var key = ‘b’;其实这里很明显就是key就是b，obj[key]=obj[‘b’]；根据属性名不符合JS标识符命名规范，则必须用方括号的写 法来访问，这里就是2，因为符合JS标识符命名规范，也可以用方括号的写 法来访问
属性的更改
直接使用赋值运算符重新对某属性赋值即可更改属性
var obj = { a: 10};obj.a = 30;obj.a++;属性的创建
如果对象本身没有某个属性值，则用点语法赋值时，这个属 性会被创建出来
var obj = { a: 10};obj.b = 40;属性的删除
如果要删除某个对象的属性，需要使用delete操作符
var obj = { a: 1, b: 2};delete obj.a;对象的方法
如果某个属性值是函数，则它也被称为对象的“方法”
var xiaoming = { name: '小明', age: 12, sex: '男', hobbys: ['足球', '游泳', '编程'], 'favorite-book': '舒克和贝塔', sayHello: function () { console.log('你好，我是小明，今年12岁，我是个男生'); }};方法的调用
使用“点语法”可以调用对象的方法
xiaoming.sayHello();方法也是函数，只不过方法是对象的“函数属性”，它需要 用对象打点调用
在正式学习了什么是“方法”之后，就能深入理解之前我们 学习的一些函数的书写形式了，比如：
console.log();Math.ceil();对象的遍历
- 和遍历数组类似，对象也可以被遍历，遍历对象需要使用 for…in…循环
- 使用for…in…循环可以遍历对象的每个键
- 在后续的ES6相关课程中，还会学习新的对象遍历的方式
for…in…循环
//var k：循环变量，它会依次成为对象的每一个键；obj：要遍历的对象for (var k in obj) { console.log('属性' + k + '的值是' + obj[k]);}对象的深浅克隆
对象是引用类型值
对象是引用类型值，这意味着：
不能用var obj2 = obj1这样的语法克隆一个对象
var obj3 = { a: 10,};//obj4指向obj3，完全一个东西var obj4 = obj3;obj3.a++;console.log(obj4);使用==或者===进行对象的比较时，比较的是它们是否为内 存中的同一个对象，而不是比较值是否相同
var obj1 = { a: 1, b: 2, c: 3,};var obj2 = { a: 1, b: 2, c: 3,};console.log(obj1 == obj2); //false 不同内存console.log(obj1 === obj2); //false对象的浅克隆
复习什么是浅克隆：只克隆对象的“表层”，如果对象的某 些属性值又是引用类型值，则不进一步克隆它们，只是传递 它们的引用
使用for…in…循环即可实现对象的浅克隆
// 浅克隆var obj1 = { a: 10, b: 2, c: [11, 22, 33],};// var obj2 = obj1; //不是克隆var obj2 = {};for (var k in obj1) { obj2[k] = obj1[k];}obj1.a++;obj1.c.push(77); //obj2也会推入77，因为是浅克隆console.log(obj1 === obj2);console.log(obj1);console.log(obj2);对象的深克隆
复习什么是深克隆：克隆对象的全貌，不论对象的属性值是 否又是引用类型值，都能将它们实现克隆
和数组的深克隆类似，对象的深克隆需要使用递归
面试时经常会考察深克隆算法，必须掌握
// 深克隆var obj1 = { a: 10, b: 2, c: [ 11, 22, 33, { m: 55, n: 66, p: [11, 33], }, ],};function deepClone(obj) { if (Array.isArray(obj)) { //数组的处理方式 var result = []; for (var i = 0; i < obj.length; i++) { result.push(deepClone(obj[i])); } } else if (typeof obj == 'object') { //对象 var result = {}; for (var k in obj) { result[k] = deepClone(obj[k]); } } else { var result = obj; } return result;}var obj2 = deepClone(obj1);
obj1.a++;obj1.c.push(77); //obj2不会推入77，因为是深克隆console.log(obj1 === obj2);console.log(obj1);console.log(obj2);文章分享
如果这篇文章对你有帮助，欢迎分享给更多人！