Maison >interface Web >js tutoriel >Partager des exemples de connaissances communes de javaScript

Partager des exemples de connaissances communes de javaScript

零下一度
零下一度original
2017-06-30 10:32:501275parcourir

Objet

Les objets peuvent être définis sous deux formes : Forme déclarative et forme construite

Syntaxe formelle déclarative : var myObj = {key:value}

Syntaxe formelle constructive : var myObj = new Object(); >

Type :

Il existe six types de langage  : numéro de chaîne booléen null objet non défini

Objet intégré :

Numéro de chaîne Objet booléen Fonction Tableau Date RegExp Erreurvar myObject = {

 a:2

}

 myObject.a //2 Accès aux propriétés

myObject["a"] // 2 accès par clé

ES6

Nom de la propriété calculable

var préfixe = "foo";

var monObjet = {

[préfixe + "bar"] : "bonjour",

[préfixe + "baz"] : "monde"

};

monObjet["foobar"]; // bonjour

monObjet["foobaz"]; 🎜 >

1.writable

Déterminer si la valeur de la propriété peut être modifiée

var myObject = {};Object.defineProperty(myObject,"a ",{

valeur

 :

2,

inscriptible :false, // Non inscriptible

 !

configurable : vrai,énumérable : vrai

});

monObjet.a = 3;

monObjet. a; // 2

2. configurable

Tant que la propriété est configurable, vous pouvez utiliser la méthode

defineProperty(..)

pour modifier la description de la propriété.

var monObjet = {a : 2

};

monObjet.a = 3;

monObjet. a; // 3

Object.defineProperty(myObject,"a",{

valeur

 :

4

, inscriptible : vrai,configurable : faux,//

Non configurable

énumérable : ture});

monObjet.a; // 4

monObjet.a = 5;

monObjet.a; // 5

Object.defineProperty(monObjet,"a ",{

valeur

 :

6

, inscriptible : vrai,configurable : vrai ,

énumérable : ture

}) // TypeError

configurable

est modifié en

flash

est un- de cette façon, ne peut pas être annulé delete est uniquement utilisé pour supprimer les attributs supprimables de l'objet.

var monObjet = {a

:

2

};

myObject.a //2delete myObject.a;

myObject.a // undefined

3.enumerable

contrôle si la propriété est Apparaît dans l'énumération des propriétés de l'objet.

1.Objet constant, combinez inscriptible : faux et configurable : faux pour créer une vraie constante Propriétés

(ne peut être modifié, redéfini ou supprimé).

var myObject = {};

Object.defineProperty(myObject,"FAVORITE_NUMBER",{

value:42 ,

inscriptible : faux,

configurable : faux

})

2.Interdire l'extension

Pour empêcher un objet d'ajouter de nouveaux attributs et de conserver les attributs existants, vous pouvez utiliser Object.preventExtensions(...)

var myObject = {

a:2

};

Object.preventExtensions(myObject);

myObject.b = 3;

myObject.a ; / / undefined

3.Seal

Object.seal(...) créera un " Objet conservé ", cette méthode appellera en fait

Object.preventExtensions(...) sur un objet existant et marquera tout propriétés comme configurable:false.

4.Freeze

Object.freeze(...) Un objet gelé sera créé. Cette méthode appellera en fait

Object.seal(...) sur un objet existant peut également geler un objet.

Getter et Setter

var myObject = {

// Donnea Définir un getter

get a() {

return 2;

}

}

myObject.a = 3;

myObject.a; // 2

Puisque seul un est défini Le getter,, donc lors de la définition de la valeur de un , le set L'opération ignorera les opérations d'affectation et ne générera pas d'erreur.

De manière générale, getter et setter apparaissent par paires

var myObject = {

// Définir un getterobtenir un( ) {retourner ceci._a_;

},

//

définir un un

>setterdéfinir un (val) {this._a_ = val * 2;

}

};

monObjet.a = 2;

monObjet.a; // 2

Existence

Vous pouvez déterminer si cet attribut existe dans l'objet sans accéder à l'attribut :

var myObject = {

a:2

};

("a" dans monObjet); // true

("b" dans monObjet) ; // false

myObject.hasOWNProper("a"); // true

myObject.hasOwnProperty("b"); // false

in Le L'opérateur vérifie si la propriété est dans l'objet et la chaîne de prototypes [[Prototype]].

hasOwnProperty(...) vérifiera uniquement si la propriété est dans l'objet myObject.

Déterminez si la propriété est énumérable :

var myObject = {};

Object.defineProperty(

myObject,

"a",

// Faire un énumérable comme une propriété normale

{enumerable : true,value:2}

);

Object.defineProperty(

myObject,

"b",

// Laisserb non énumérable

{enumerable : false,value:3}

)

myObject.propertyIsEnumberable("a"); // true

myObject.propertyIsEnumber("b"); // false

Object.keys(myObject); "a"]

Object.getOwnPropertyName(myObject); // ["a","b"]

propertyIsEnumerable(...) vérifiera si la propriété est donnée. name existe directement dans l'objet ( au lieu de dans la chaîne du prototype) et satisfait enumerable:true

Object.keys(...) renverra un tableau contenant toutes les propriétés énumérables

Object.getOwnPropertyNames(...) Renvoie un tableau contenant toutes les propriétés, qu'elles soient énumérables ou non

Traverse

pour .. dans Peut être utilisé pour parcourir la liste de propriétés énumérables d'un objet

pour Pour les tableaux indexés numériquement, vous pouvez utiliser la boucle standard for

ES5 nouvellement ajoutée forEach(..) each(. .. some(. .)

forEach(...) parcourra toutes les valeurs du tableau et ignorera la valeur de retour de la fonction de rappel.

chaque(...) s'exécutera jusqu'à ce que la fonction de rappel renvoie false

certains(...) Il s'exécutera jusqu'à ce que la fonction de rappel renvoie true

Es6 ajoute pour .. de Syntaxe de boucle

var monArray = [ 1,2,3];

for(var v de monArray){

console.log(v)

}

Les objets ordinaires n'ont pas de @@iterator, peuvent être personnalisés pour tout objet que vous souhaitez parcourir

var myObject = {

a:2,

b:3

};

Object.defineProperty(myObject,Symbol.iterator,{

enumerable : false ,

inscriptible : faux,

configurable : vrai,

valeur : fonction() {

var o = this;

var idx = 0;

var ks = Object.keys(o);

return {

suivant : fonction(){

valeur : o[ks[idx++]],

terminé :(idx > ks.length)

}

}

}

})

// 手动遍历monObjet

var it = monObjet[Symbol.iterator]();

it.next(); // {valeur2done : false}

it.next(); // {valeur3done : false}

it.next(); // {undéfinidone : vrai🎜>

//

pour..de 遍历monObjet

for(var v de monObjet){

  console.log(v)

}  // 2 // 3

 

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