In the above, we analyzed and explained Object , and talked about the creation of objects. Among them, new is an important keyword for creating objects. In this section, we will talk about new and what new is used for.
one sentence explanation
The essence of new is to let developers write fewer lines of code
text
Before talking about new, you need to know more or less about prototypes. Here we assume that you already know the knowledge of prototype inheritance (I will introduce it in detail in the prototype chapter later)
In short, the meaning of the new keyword is:
- Create a new object in memory
- Assign the [[Prototype]] of the new object to the prototype property of the constructor
- Point this in the constructor to the new object
- Execute the code in the constructor
- If the constructor returns a non-null object, it returns the object; otherwise it returns the new object just created
These processes complete object creation, prototypal inheritance, and property initialization, and are called implicit prototypal inheritance
In addition to that, object literals are also implicitly inherited. It's just that object literals serve Object constructors, while new serves arbitrary constructors
According to the two-layer implicit behavior of implicit inheritance
- Implicitly create objects through new Object()/Object.create()
- Implicit prototypal inheritance
But our point in this section is not to pursue implicit prototypal inheritance, but to know what new does
First, new belongs to implicit prototypal inheritance. What is implicit prototypal inheritance, that is, the bottom layer of the language does inheritance for us. The developer only needs to call new Constructor, and the object after the instance can automatically inherit the prototype of the Constructor. The bottom layer does this for the convenience of our development and use.
implement new
Let's try handwriting new
function new2(Constructor, ...args) {
// (1)、创建一个新对象
var obj = Object.create(null);
// (2)、新对象的[[Prototype]]特性被赋值为 构造函数的 prototype 属性
obj.__proto__ = Constructor.prototype;
// (3)、构造函数内部的 this 被赋值为这个新对象
// (4)、执行构造函数内部的代码
var result = Constructor.apply(obj, args);
// (5)、如果构造函数返回非空对象，则返回该对象；否则，返回刚创建的新对象
return typeof result === 'object' ? result : obj;
}This method is based on Object.create, and there is no such API before ES5, so how to use ES3 (new Object()) to implement new?
Simply put, it is to obtain the remaining parameters before implementing Object.create and destructuring assignment
function new3() {
// 基于 new Object 创建实例
var obj = new Object(),
// 获取外部传入的构造器
Constructor = Array.prototype.shift.call(arguments);
// 手写 Object.create() 的核心
var F = function () {}
F.prototype = Constructor.prototype
// 指向正确的原型
obj = new F()
// 借用外部传入的构造函数给 obj 设置属性
var result = Constructor.apply(obj, arguments)
// 执行结果如果是非空对象，则返回该对象；否则，返回刚创建的新对象
return typeof result === 'object' ? result : obj
}test a wave
function User(firstname, lastname) {
this.firstname = firstname;
this.lastname = lastname;
}
const user2 = new2(User, 'johnny', 'joestar')
const user3 = new3(User, 'johnny', 'joestar')appendix:
A description of what a constructor call to new does in Advanced JavaScript Programming 4th Edition:
(1) Create a new object in memory
(2) The [[prototype]] property inside this new object is assigned as the prototype property of the constructor
(3) This inside the constructor is assigned the new object (that is, this points to the new object)
(4) Execute the code inside the constructor (add properties to the new object)
(5) If the constructor returns a non-null object, return the object; otherwise, return the new object just created
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。