JS手写New操作符
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JS手写New操作符相关的知识,希望对你有一定的参考价值。
参考技术A 手写new操作符的流程:// 1.定义一个空对象
// 2.隐式原型指向构造函数的显式原型
// 3.执行构造函数,this指向空对象
// 4.返回对象
function myNew(fn,...args)
// 1.定义一个空对象
const obj=;
// 2.隐式原型指向构造函数的显式原型
obj._proto_=fn.prototype;
// 3.执行构造函数,this指向空对象
fn.apply(obj,args)
// 4.返回对象
return obj;
js面试-手写代码实现new操作符的功能
我们要搞清楚new操作符到底做了一些什么事情?
1.创建一个新的对象
2.将构造函数的作用域赋给新对象(因此this指向了这个新对象)
3.执行构造函数中的代码(为这个新对象添加属性)
4.返回新对象
上面给出了new操作符到底做了一些什么事情,我们就一步一步的实现这些,是不是就实现了new操作符的功能。
首先定义一个构造函数Person如下:
function Person(name) { this.name = name; } Person.prototype.sayName = function () { console.log(this.name); }
然后创建模拟new操作符功能的函数如下:
function Person(name) { this.name = name; } Person.prototype.sayName = function () { console.log(this.name); } function createPerson() { // 1 创建一个新的对象 var o = {}; // 2 获取构造函数,以便实现作用域的绑定 var _constructor = [].shift.call(arguments); // 3 由于通过new操作创建的对象实例内部的不可访问的属性[[Prototype]](有些浏览器里面为__proto__) //指向的是构造函数的原型对象的,所以这里实现手动绑定。 o.__proto__ = _constructor.prototype; // 4.作用域的绑定使用apply改变this的指向
_constructor.apply(o, arguments); return o; } var person1 = createPerson(Person, ‘ydb‘); person1.sayName();
这样子就实现了new操作符的功能了。
其实上面代码还可以这样子写:
function Person(name) { this.name = name; } Person.prototype.sayName = function () { console.log(this.name); } function createPerson() { // 1 获取构造函数,以便实现作用域的绑定 var _constructor = [].shift.call(arguments); // 2 创建一个对象 var o = Object.create(_constructor.prototype); // 由于通过new操作创建的对象实例内部的不可访问的属性[[Prototype]](有些浏览器里面为__proto__) //指向的是构造函数的原型对象的。 //而Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__。// 4.作用域的绑定 _constructor.apply(o, arguments); return o; } var person1 = createPerson(Person, ‘ydb‘); person1.sayName();
用Object.create可以创建一个没有任何属性的对象,如下:
var o = Object.create(null);
以上是关于JS手写New操作符的主要内容,如果未能解决你的问题,请参考以下文章