【小白鲨笔记】js面试题（八）

八、new操作符具体执行机制

1. 创建了一个空的对象

   function fn(){}
   console.log(new fn()) //空对象fn
   

2. 将空对象的原型，指向于构造函数的原型

   function fn(){}
   console.log(new fn().__proto__ == fn.prototype) //true -- 同一个原型
   

3. 将空对象作为构造函数的上下文（改变this指向）

   funtion fn() {
       console.log(this)
       this.name = 'zs'
   }
   console.log(fn()) //this指向window，因此不存在name属性
   console.log(new fn()) //this指向fn对象，因此name属性是zs
   

4. 对构造函数有返回值的处理判断：

   • 基本数据：忽视

   • 引用数据：覆盖当前对象

   function fn1() { return {} }
   function fn2() { return '01' }
   console.log(new fn1()) //返回：最后返回的对象，而不是fn对象
   console.log(new fn2()) //返回：不影响
   

模拟new过程

function A (age,name){
    this.age = age;
    this.name = name;
}
function create(fn, ...args){
    //1. 创建了一个空的对象
    var obj = {}; //var obj = Object.create({})
    //2. 将空对象的原型，指向于构造函数的原型
    Object.setPrototypeOf(obj,fn.prototype);
    //3. 将空对象作为构造函数的上下文（改变this指向）
    var result = fn.apply(obj,args);
    //4. 对构造函数有返回值的处理判断
    return result instanceof Object ? result : obj;
}
console.log(create(A, 18, 'jaws'))