Maison > Article > interface Web > Méthodes pour implémenter les fonctionnalités dynamiques du prototype JS

Méthodes pour implémenter les fonctionnalités dynamiques du prototype JS

小云云original: 2018-03-28 17:24:461459parcourir

Lorsque j'apprenais JS, j'ai rencontré des problèmes liés aux modifications de prototypes par fonctions et objets d'instance. J'aimerais les partager avec vous, en espérant aider tout le monde.

Exemple 1 :

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>原型的动态特性1</title>
</head>
<body>
</body>
<script>
// 创建一个函数
var Person = function() {};

// 给函数的原型添加一个方法
Person.prototype.say = function() {
console.log("下雪的季节...");
};

// 创建第一个实例对象
var p1 = new Person();

// 修改原型中的方法（true）
Person.prototype = {
say: function() {
console.log("一个人的女团...");
}
};

// 创建第二个实例对象
var p2 = new Person();

// 打印p1与p2中的say方法
p1.say(); /* 下雪的季节 */
p2.say(); /* 一个人的女团 */
</script>
</html>

Dans le cas, Person.prototype est utilisé pour rediriger le prototype. L'ancien prototype est séparé de la fonction et le prototype de la fonction. veut seulement un nouveau prototype, donc l'objet d'instance nouvellement créé p2 imprime "groupe de filles d'une personne"

Exemple 2 :

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>原型的动态特性2</title>
</head>
<body>
</body>
<script>
// 创建一个函数
var Person = function() {};

// 给函数的原型添加一个方法
Person.prototype.say = function() {
console.log("下雪的季节...");
};

// 创建第一个实例对象
var p1 = new Person();

// 修改p1原型中的方法（false）
p1.prototype = {
say: function() {
console.log("一个人的女团...");
}
};

// 创建第二个实例对象
var p2 = new Person();

// 打印p1与p2中的say方法
p1.say(); /* 下雪的季节 */
p1.prototype.say();/* 一个人的女团，此处调用的是实例对象自己的prototype属性中的方法 */
p2.say(); /* 下雪的季节 */
</script>
</html>

Dans le cas, p1.prototype ne peut pas La redirection de la fonction et de son propre prototype ajoute simplement un attribut de prototype. Par conséquent, les résultats imprimés de p1.say() et p1.prototype.say() sont incohérents

Exemple 3 :

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>原型的动态特性2</title>
</head>
<body>
</body>
<script>
// 创建一个函数
var Person = function() {};

// 给函数的原型添加一个方法
Person.prototype.say = function() {
console.log("下雪的季节...");
};

// 创建第一个实例对象
var p1 = new Person();

// 修改p1原型中的方法（true）
p1.__proto__ = {
say: function() {
console.log("一个人的女团...");
}
};

// 创建第二个实例对象
var p2 = new Person();

// 打印p1与p2中的say方法
p1.say(); /* 一个人的女团 */
p1.__proto__.say();/* 一个人的女团 */
p2.say(); /* 下雪的季节 */
</script>
</html>

Dans le cas, p1.__proto__ est utilisé pour rediriger le prototype de p1, donc les impressions de say() dans p1 et p2 sont différentes

Des trois cas, je Ce qui suit des conclusions sont tirées :

(1) Nom de la fonction.prototype peut rediriger le prototype de la fonction, et l'ancien prototype sera séparé de la fonction

(2) Nom de l'objet . prototype ne peut pas rediriger le prototype de la fonction, et ajoutera uniquement un attribut prototype à l'objet instance (si l'objet instance n'a pas d'attribut prototype)

(3) Le nom de l'objet .__proto__ peut être le prototype de l'objet Redirect, mais ne peut pas changer le prototype d'autres objets d'instance créés par la fonction

(4) le prototype est appelé comme nom de fonction, et le prototype peut être redirigé

(5) __proto__ est l'appel du nom d'objet qui peut rediriger le prototype de l'objet, mais n'affecte pas les prototypes de fonctions et autres objets d'instance.

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!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Comment utiliser le serveur de fichiers statiques du nœudArticle suivant：Comment utiliser le serveur de fichiers statiques du nœud

Articles Liés

Voir plus