js 对象细节

Posted 2020-10-16 HelloHello233

原型和原型链

在对象自身身上找不到指定属性时，就会到这个对象的原型上找，原型也是指向一个对象，在这个对象上还找不到对应属性，则继续到原型上来找...以上过程形成原型链。

访问对象的原型：obj.__proto__ 或者可以调用Object.getPrototypeOf(obj)，返回的值也是obj.__proto__；

obj.__proto__ 和 obj.constructor.prototype 默认指向同一个对象，可以理解为默认情况下：obj.__proto__ = obj.constructor.prototype = xx

空对象{} 的构造函数为 Object

直接在空对象的原型上添加或修改属性，会作用到js的所有对象中，因为所有的js对象的原型链终点都是Object.prototype所指向的对象：

Object.getPrototypeOf({}).x=13;
console.log([].x)    //13

对象属性

以下方式添加的属性都是添加到对象身上。

var obj;
obj = {
  x:123,
    method(){
      return 123
    }
};
obj.y = 99;

// function Person(){
//     this.a = 123;
// }
//
// obj = new Person();
console.log(obj)

包括Object.assign(target,src1,src2)，仅仅把src对象身上的属性添加到target身上而已。可以使用assign来实现对象浅拷贝。

对象的遍历：http://es6.ruanyifeng.com/#docs/object#属性的可枚举性和遍历

 

对于 ES6 的class ，方法直接定义在原型上

class Point {
  toString() {
    // ...
  }
}
// 等同于
Point.prototype = {
  toString() {},
};

typeof Point // "function"

 

克隆

首先复制原型，后复制对象身上的属性。

function clone(origin) {
  let originProto = Object.getPrototypeOf(origin);
  return Object.assign(Object.create(originProto), origin);
}

ps：

Object.create(target)   的作用实际上以target为原型（__proto__），创建并返回一个空对象。

继承

　　ES5中需要手动修改原型链来实现继承

　　ES6中使用extend语法实现继承，本质是首先生成一个父类的对象（在子类的构造函数中必须显式或隐式调用了父类的构造函数），然后以这个父类的对象为原型（__proto__），创建子类对象。

 

通过class new出来的对象的constructor指向class，在ES5也是类似，通过函数new出来的对象的constructor指向函数