美文网首页
js中new关键字到底做了什么...

js中new关键字到底做了什么...

作者: heachou | 来源:发表于2017-05-03 09:47 被阅读0次

    直接看代码:
    <pre>
    var test = function(){
    console.log(this)
    }
    test() // 浏览器中 this 指向的是window
    //通过new关键字
    new test()//指向test
    </pre>
    说明new关键字改变了this的指向,那么在这个过程中到底做了些什么呢?
    上代码:
    <pre>
    // 创建一个构造函数
    var Person = function(name, age) {
    this.name = name;
    this.age = age;
    this.getName = function(){
    return this.name;
    }
    }

    // 将构造函数以参数的形式传入
    function New(func) {
    // 需要返回的
    var res = {};

    if(func.prototype !== null){
    // 将实例的proto指向构造函数的原型
    res.proto = func.prototype;
    }
    // 如果构造函数有返回结果,用ret接收,通过apply,将构造函数的this指向实例res;
    var ret = func.apply(res,Array.prototype.slice.call(arguments,1));

    if((typeof ret === 'object' || typeof ret === 'function' )&& ret != null){
    return ret;
    }
    return res;
    }

    var p1 = New(Person, 'tom', 20);
    var name = p1.getName();
    console.log(name);//tom
    console.log(p1 instanceof Person);//true

    var p2 = new Person('jerry',10);
    console.log(p2.age);//10
    console.log(p2 instanceof Person);//true

    </pre>
    可以看出,在new的过程中,主要实现了如下过程
    1.声明一个中间对象
    2.将该中间对象的proto指向构造函数的原型
    3.将构造函数的this通过apply指向中间对象
    4.返回该中间对象,也就是返回了实例对象

    相关文章

      网友评论

          本文标题:js中new关键字到底做了什么...

          本文链接:https://www.haomeiwen.com/subject/pokktxtx.html