• JS中new运算符的实现原理


    当我们用new运算符new一个构造函数产生一个实例时,比如说: var obj = new Func 时,其背后的步骤是这样的:

    1:创建一个继承自 Func.prototype 的新对象;
    2:执行构造函数 Func ,执行的时候,相应的传参会被传入,同时上下文(this)会被指定为第一步创建的新实例;
    3:如果构造函数返回了一个“对象”,那么这个对象会取代步骤1中new出来的实例被返回。如果构造函数没有返回对象,那么new出来的结果为步骤1创建的对象。

    注意:new Func 等同于new Func(),只能用在不传递任何参数的情况。

    按照上述原理,写一段代码模拟new运算符的实现原理:

    //new运算符原理实现
    var new1 = function(fun){
        var newObj = Object.create(fun.prototype);
        var returnObj = fun.call(newObj);
        if(typeof returnObj === 'object'){
            return returnObj
        }else{
            return newObj
        }
    }

    其中  var newObj  = Object.create(fun.prototype)  的意思是:创建一个新对象newObj,并让 newObj.__proto__  指向 fun,即  newObj.__proto__  === fun 返回true。

    测试一下~

    var strObj = new1(String);
    alert(strObj instanceof String); //true
    alert(strObj.__proto__.constructor === String); //true

    可以看到,new1函数的运行效果和new运算符是一样的。我们继续给String的原型上添加一个方法,看看new1函数得到的strObj能否继承到这个方法:

    String.prototype.defineByN = function(){
        alert("我是自定义方法");
    }
    strObj.defineByN();  //弹出“我是自定义方法”

    可以看到new1函数得到的strObj继承了到这个方法。

  • 相关阅读:
    KMP
    C. Three Base Stations
    Calculation 2 [HUD 3501]
    组合数 com(n,r)
    Keep Deleting [zoj 3643]
    LightSwitch V1.0 正式发布,配套控件收集 !
    微软 Lightswitch 学习研讨 QQ群:97010590
    IIS 7开发与管理完全参考手册
    电影 下载 地址收集
    2011年A股中报十大筹码集中王 (收藏)
  • 原文地址:https://www.cnblogs.com/YiNongLee/p/9336609.html
Copyright © 2020-2023  润新知