JavaScript ------ new的模拟实现

new的定义

new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。

调用New的时候到底发生了什么?

调用New

  • 创建了一个空对象
  • 让该空对象继承构造函数的原型对象
  • 将构造函数的this自动指向新对象
  • 返回新对象的地址

初步模拟new的实现

function newObject(){
	//第一步:创建一个空对象
	var obj = new Object();
	//获取构造函数(同时删除参数列表中的第一个参数)
	var Constructor = [].shift.call(arguments);
	//第二步:让新对象的 __proto__ 属性指向构造函数的原型
	obj.__proto__ = Constructor.prototype;
	//第三步:将构造函数的this自动指向新对象
	Constructor.apply(obj,arguments);
	//第四步:返回该对象
	return obj;
}

测试一下

function Animal(name,age){
    this.name = name;
    this.age = age;
    this.skinColour = function(){
        console.log(‘我是粉皮肤’);
    };
}

Animal.prototype.getName=function(){
    console.log("I am "+this.name);
};
var yellow = newObject(Animal,'dog1',1.8);
yellow.name;//dog1
yellow.age;//1.8;
yellow.getName();//I am dog1

到目前为止,初步模拟new的实现步骤已经完成。但是一些特殊情况下,构造函数会有返回值。当返回值是基本类型时,跟没有返回值处理结果一样。但是当返回值是一个对象时,就只能访问构造函数返回对象的属性跟方法了。(这个大家自行模拟一下)

最终版new模拟实现

function newObject(){
	//第一步:创建一个空对象
	var obj = new Object();
	//获取构造函数(同时删除参数列表中的第一个参数)
	var Constructor = [].shift.call(arguments);
	//第二步:让新对象的 __proto__ 属性指向构造函数的原型
	obj.__proto__ = Constructor.prototype;
	//第三步:将构造函数的this自动指向新对象,并取到构造函数的返回值
	var returnObj = Constructor.apply(obj,arguments);
	//第四步:返回该对象
	return typeof returnObj == 'Object' ? returnObj : obj;
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值