Cet article vous apporte des connaissances pertinentes sur javascript, qui présente principalement des problèmes liés à new. L'opérateur new crée une instance d'un type d'objet défini par l'utilisateur ou l'un des types d'objet intégrés avec un constructeur. .
【Recommandations associées : Tutoriel vidéo javascript】
Qu'est-ce que le nouveau ? new呢？
new运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象类型之一。
光看定义还是有几分晦涩，直接看一个具体的例子，来了解一下JavaScript中的new实现的功能。
// 现实中瘦不了，但网络中一定要保持苗条
function Thin_User(name, age) {
this.name = name;
this.age = age;
}
Thin_User.prototype.eatToMuch = function () {
// 白日做梦吧，留下肥胖的泪水
console.log('i eat so much, but i\'m very thin!!!');
}
Thin_User.prototype.isThin = true;
const xiaobao = new Thin_User('zcxiaobao', 18);
console.log(xiaobao.name); // zcxiaobao
console.log(xiaobao.age); // 18
console.log(xiaobao.isThin); // true
// i eat so much, but i'm very thin!!!
xiaobao.eatToMuch();通过上面这个例子，我们可以发现xiaobao可以：
Thin_User中属性Thin_User.prototype中属性描述得更直白一点，new做了这些事：
__proto__->Thin_User.prototype
this指向新对象由于new是关键字，我们无法像模拟数组高阶方法一样覆盖，因此我们写一个函数createObject，来模拟new的效果。使用具体如下：
function Thin_User(name, age) {}
const u1 = new Thin_user(...)
const u2 = createObject(Thin_User, ...a\)根据上面分析，createObject编写的大致步骤为：
obj
obj.__proto__->constructor.prototype(但JavaScript不推荐直接修改__proto__属性，提供了setPrototypeOf方法来专门修改原型)constructor.call/apply(obj, ...)，将属性添加到obj上obj
__proto__和prototype，可以看JavaScript之彻底理解原型与原型链call/apply，可以看JavaScript之手撕call、apply
学习完这些，我们就可以编写第一版代码：
function createObject(Con) {
// 创建新对象obj
// var obj = {};也可以
var obj = Object.create(null);
// 将obj.__proto__ -> 构造函数原型
// (不推荐)obj.__proto__ = Con.prototype
Object.setPrototypeOf(obj, Con.prototype);
// 执行构造函数
Con.apply(obj, [].slice.call(arguments, 1));
// 返回新对象
return obj;}众所周知，函数是有返回值的，那构造函数如果有返回值，最终执行new后返回的结果是怎样的那？
假设构造函数返回值为一个基本类型，我们来看一下最后的返回结果：
function Thin_User(name, age) {
this.name = name;
this.age = age;
return 'i will keep thin forever';
}
Thin_User.prototype.eatToMuch = function () {
console.log('i eat so much, but i\'m very thin!!!');
}
Thin_User.prototype.isThin = true;
const xiaobao = new Thin_User('zcxiaobao', 18);
console.log(xiaobao.name); // zcxiaobao
console.log(xiaobao.age); // 18
console.log(xiaobao.isThin); // true
// i eat so much, but i'm very thin!!!
xiaobao.eatToMuch();最后的返回结果好像受到任何干扰，难道构造函数不会对返回值进行处理吗？
不急，我们来接着测试一下返回值为对象的情况。
function Thin_User(name, age) {
this.name = name;
this.age = age;
return {
name: name,
age: age * 10,
fat: true
}
}
Thin_User.prototype.eatToMuch = function () {
// 白日做梦吧，留下肥胖的泪水
console.log('i eat so much, but i\'m very thin!!!');
}
Thin_User.prototype.isThin = true;
const xiaobao = new Thin_User('zcxiaobao', 18);
// Error: xiaobao.eatToMuch is not a function
xiaobao.eatToMuch();当我执行eatToMuch时，控制台直接报错，没有当前函数，于是我打印了xiaobao对象：
发现xiaobao对象的age发生了改变，而且增加了fat
L'opérateur new crée une instance d'un type d'objet défini par l'utilisateur ou de l'un des types d'objet intégrés dotés d'un constructeur.
C'est encore un peu obscur rien qu'en regardant la définition. Regardons un exemple spécifique pour comprendre les fonctions implémentées par new en JavaScript. function createObject(Con) {
// 创建新对象obj
// var obj = {};也可以
var obj = Object.create(null);
// 将obj.__proto__ -> 构造函数原型
// (不推荐)obj.__proto__ = Con.prototype
Object.setPrototypeOf(obj, Con.prototype);
// 执行构造函数，并接受构造函数返回值
const ret = Con.apply(obj, [].slice.call(arguments, 1));
// 若构造函数返回值为对象，直接返回该对象
// 否则返回obj
return typeof(ret) === 'object' ? ret: obj;}xiaobao peut :
Thin_User Attributs dans le code>
Thin_User.prototype
new fait ces choses : __proto__->Thin_User.prototype
this Pointer vers un nouvel objetnew est un mot-clé, nous pouvons' Pour ne pas le remplacer comme pour simuler des méthodes d'ordre supérieur de tableau, nous écrivons donc une fonction createObject pour simuler l'effet de new. L'utilisation spécifique est la suivante : 🎜rrreee🎜🎜Simulation préliminaire🎜🎜🎜Selon l'analyse ci-dessus, les étapes générales pour écrire createObject sont : 🎜obj obj.__proto__->constructor.prototype(🎜Mais JavaScript ne recommande pas de modifier directement l'attribut __proto__ et fournit la méthode setPrototypeOf pour spécifiquement modifier le prototype🎜)constructor.call/apply(obj, ...) pour ajouter des propriétés à obj
obj
🎜🎜Après les avoir appris, nous pouvons écrire la première version du code :🎜rrreee🎜🎜Effet de valeur de retour🎜🎜🎜Comme nous tout le monde le sait, les fonctions ont des valeurs de retour. Si le constructeur a une valeur de retour, quel est le résultat renvoyé après l'exécution de__proto__ et prototype, vous pouvez voir JavaScript pour une compréhension complète des prototypes et des chaînes de prototypes
call/apply code>, vous pouvez voir l'appel de JavaScript et postuler🎜
new ? 🎜eatToMuch, la console a signalé une erreur directement et il n'y avait aucune fonction actuelle, j'ai donc imprimé xiaobao Objet :🎜🎜 On constate que le age de l'objet xiaobao a changé, et l'attribut fat a été ajouté, qui est exactement le même comme valeur de retour du constructeur. 🎜🎜Après avoir lu ces deux exemples, vous pouvez en gros clarifier la situation lorsque le constructeur renvoie une valeur : 🎜Lorsque le constructeur renvoie un objet, l'objet est renvoyé directement. 🎜🎜🎜Simulation de la version finale🎜rrreee🎜[Recommandations associées : 🎜Tutoriel vidéo javascript🎜]🎜Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
![Analyse approfondie de JavaScript [Le front-end Web doit connaître les compétences de base]](https://img.php.cn/upload/course/000/000/041/61d3ff1c83b43350.jpg)
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
