Comment personnaliser des objets en JavaScript

Méthode personnalisée : 1. Créez directement via "nom/valeur de l'attribut", syntaxe "nom de l'objet var = {nom de l'attribut : valeur de l'attribut};" 2. Utilisez "nom de l'objet var = nom du nouveau constructeur (args );" instruction; 3. Utilisez l'instruction "Object.create (objet prototype, descripteurs)".

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

Dans Js, en plus des objets intégrés tels que Array, Date et Number, les développeurs peuvent créer leurs propres objets via le code Js.

Caractéristiques de l'objet

① La structure est similaire à un « dictionnaire » : les attributs de l'objet sont similaires à des paires clé/valeur ; l'attribut est une chaîne et la valeur de l'attribut est N'importe quel type.

② Héritage du prototype : les objets Js peuvent hériter des attributs du prototype.

③ Structure dynamique : les attributs des objets peuvent être ajoutés et supprimés dynamiquement.

④ Type de référence : les objets en js sont des types de référence. a est un objet, b=a, et modifier b entraînera également la modification de a.

Création de méthodes d'objet

Il existe trois manières principales de créer des objets personnalisés dans JS : les littéraux d'objet, les nouveaux constructeurs et la méthode Object.create(). Les objets prototypes hérités par chaque méthode de création sont différents :

① Littéral objet : Le prototype est Object.prototype.

② nouveau constructeur : Le prototype est l'attribut prototype du constructeur.

③ Object.create() : Le prototype est le premier paramètre transmis. Si le premier paramètre est nul, Object.prototype est utilisé comme prototype.

1. Quantité directe de l'objet

Description : est créé directement via le nom/la valeur de l'attribut.

Syntaxe : var o = { name:'tom', age:22 };

Prototype : Object.prototype

Scénarios applicables : Application dans un périmètre précis.

Exemple :

var o = {
    name: 'tom'
}
console.log(o.constructor.prototype); // => Object() ：对象直接量的原型为Object
console.log(o.constructor.prototype === Object.prototype); // true

2. nouveau constructeur

Description : Le constructeur est aussi une sorte de fonction, mais afin de distinguer les fonctions couramment utilisées, le nom de la fonction du constructeur est écrit en casse chameau (la première lettre est en majuscule).

Syntaxe : var o = new ClassName();

Prototype : L'attribut prototype du constructeur.

Exemple :

// 1.创建构造函数
function People(name) {
    this.name;
}

var p = new People('Tom');
console.log(p.constructor.prototype); // => People{} ：原型为构造函数的prototype
console.log(p.constructor.prototype === People.prototype); // => true

// 2.自定义对象的多层继承 ：constructor返回最先调用的构造函数 
function Student(age) {
    this.age = age;
}
Student.prototype = new People(); // 设置Student的原型为People对象

var s = new Student(22); // 对象初始化时，先调用People()，再调用Student()
console.log(s.constructor); // => function People ：对象s返回的构造函数为People
console.log(s.constructor.prototype); // => People{} ：原型对象为People
console.log(s.constructor.prototype === People.prototype); // => true

3. Object.create(prototype, propertyDescriptor) : spécification ECMAScript 5

Description : Créez et renvoyez un objet avec le prototype spécifié et les propriétés spécifiées.

Syntaxe : Object.create(prototype, propertyDescriptor)

Paramètres :

①prototype {prototype} : Créer un objet Prototype , peut être nul. S'il est nul, le prototype de l'objet n'est pas défini.

②propertyDescriptor {propertyDescriptor} Facultatif : descripteur de propriété.

Prototype : Le prototype silencieux est le paramètre ① ; si le paramètre ① est nul, le prototype de l'objet est indéfini.

Exemple :

// 1.建立一个原型为null的对象
var o = Object.create(null, {
    name: {
        value: 'tom'
    }
});
console.log(o.constructor); // => undefined 

// 2.创建一个原型为Array的对象
var array = Object.create(Array.prototype, {});
console.log(array.constructor); // => function Array 构造函数 
console.log(array.constructor.prototype); // => [] ：原型对象为数组

// 3.创建一个原型为自定义类的对象
function People() { }
var p = Object.create(People.prototype, {});
console.log(p.constructor); // => function People 构造函数 
console.log(p.constructor.prototype); // => People{} ：原型对象People

[Recommandations associées : Tutoriel d'apprentissage 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!