Résumé des différentes méthodes d'Object en JavaScript (avec exemples)

Cet article vous présente un résumé des différentes méthodes d'Object en JavaScript (avec des exemples). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

1. hasOwnProperty

obj.hasOwnProperty(prop)

Parameters

prop : le nom de la chaîne d'attribut à détecter ou Symbole

Valeur de retour

Booléen

utilisé pour déterminer si un objet contient la propriété spécifiée. Tous les objets qui héritent de Object hériteront de la méthode hasOwnProperty(). Cette méthode est utilisée pour détecter si un objet contient ses propres propriétés spécifiques. Contrairement à l'opérateur in, cette méthode ignore les propriétés héritées de la chaîne de prototypes

Object.prototype.a = 'aaa';
var obj = {
  b: 'bbb'
}
console.log(obj.hasOwnProperty(a)); // false
for(var item in obj) {
  console.log(item); // b  a。此结果也找到了从原型链上继承过来的属性
}

Si hasOwnProperty est utilisé comme nom de propriété

var foo = {
  hasOwnProperty: function() {
    return false
  },
  bar: 'bar'
}

foo.hasOwnProperty('bar'); // false
// 如果这种情况下,想调用原型链上的方法
({}).hasOwnProperty.call(foo, 'bar'); // 即foo对象调用了{}对象的方法。
// 等同于
Object.prototype.hasOwnProperty.call(foo, 'bar')

Extension : Parcourir toutes les propriétés d'un objet

for ... in bouclera uniquement sur les propriétés énumérables, vous ne devez donc pas parcourir les propriétés non énumérables sur cette base.

2.getOwnPropertyNames

Object.getOwnPropertyNames(obj)

Parameters

obj Un objet avec ses propres propriétés énumérables et non énumérables Le nom est renvoyé .

Valeur de retour

Un tableau de chaînes correspondant à ses propres propriétés trouvées sur l'objet donné.

Object.getOwnPropertyNames() renvoie un tableau contenant des propriétés énumérables et non énumérables dans obj.

3.Object.keys()

Object.keys(obj)

Paramètres

L'objet pour renvoyer ses propres propriétés énumérées

Valeur de retour

Un tableau de chaînes représentant toutes les propriétés énumérables de l'objet donné

Description

Object.keys() renvoie un tableau dont les éléments sont des caractères Un tableau de chaînes dont les éléments proviennent de propriétés directement énumérables de l'objet donné. L'ordre de ces propriétés est cohérent avec le parcours manuel de la propriété (pour...dans...).

var obj = {a:'a',b:'b',c:'c'};
console.log(Object.keys(obj));// ['a', 'b', 'c']

4.Object.values()

Object.keys() renvoie la valeur clé, Object.values() renvoie la valeur, les règles sont les mêmes que celles d'Object. clés().

5.Object.assign()

Object.assign() est utilisé pour copier toutes les valeurs énumérables d'un objet vers l'objet cible. Il renverra l'objet cible.

Object.assign(target, ...sources);

Description

Si les propriétés de l'objet cible ont les mêmes propriétés que dans l'objet source. Les propriétés de l'objet cible seront écrasées. Les propriétés du type String et du type Symbol seront copiées.
Dans le cas d'une erreur, par exemple si la propriété n'est pas accessible en écriture, une TypeError est générée et l'objet cible peut être modifié si des propriétés ont été ajoutées avant que l'erreur ne soit générée.

const a = {a: 'a', b: 'b'};
var b = Object.assign({}, a);
console.log(b); //{a: 'a', b: 'b'}

Copie approfondie, Object.assign() ne peut copier que les propriétés du premier calque de l'objet. Si la valeur de propriété de l'objet source est une référence à l'objet, il copie uniquement cette valeur de référence.

  let obj1 = { a: 0 , b: { c: 0}};
  let obj2 = Object.assign({}, obj1);
  console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
  
  obj1.a = 1;
  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
  console.log(JSON.stringify(obj2)); // { a: 0, b: { c: 0}}
  
  obj2.a = 2;
  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 0}}
  console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 0}}
  
  obj2.b.c = 3;
  console.log(JSON.stringify(obj1)); // { a: 1, b: { c: 3}}
  console.log(JSON.stringify(obj2)); // { a: 2, b: { c: 3}}
  
  // Deep Clone
  obj1 = { a: 0 , b: { c: 0}};
  let obj3 = JSON.parse(JSON.stringify(obj1));
  obj1.a = 4;
  obj1.b.c = 4;
  console.log(JSON.stringify(obj3)); // { a: 0, b: { c: 0}}

Fusionner des objets

var o1 = { a: 1 };
var o2 = { b: 2 };
var o3 = { c: 3 };

var obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }
console.log(o1);  // { a: 1, b: 2, c: 3 }, 注意目标对象自身也会改变。

Fusionner des objets avec les mêmes propriétés, et les propriétés sont écrasées par d'autres objets avec les mêmes propriétés dans les paramètres suivants.

var o1 = { a: 1, b: 1, c: 1 };
var o2 = { b: 2, c: 2 };
var o3 = { c: 3 };

var obj = Object.assign({}, o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }

Copier les attributs de type symbole

var o1 = { a: 1 };
var o2 = { [Symbol('foo')]: 2 };

var obj = Object.assign({}, o1, o2);
console.log(obj); // { a : 1, [Symbol("foo")]: 2 } (cf. bug 1207182 on Firefox)
Object.getOwnPropertySymbols(obj); // [Symbol(foo)]

Les attributs hérités et les attributs non dénombrables ne peuvent pas être copiés

var obj = Object.create({foo: 1}, { // foo 是个继承属性。
    bar: {
        value: 2  // bar 是个不可枚举属性。
    },
    baz: {
        value: 3,
        enumerable: true  // baz 是个自身可枚举属性。
    }
});

var copy = Object.assign({}, obj);
console.log(copy); // { baz: 3 }

Le type d'origine sera emballé sous forme de objet

var v1 = "abc";
var v2 = true;
var v3 = 10;
var v4 = Symbol("foo")

var obj = Object.assign({}, v1, null, v2, undefined, v3, v4); 
// 原始类型会被包装，null 和 undefined 会被忽略。
// 注意，只有字符串的包装对象才可能有自身可枚举属性。
console.log(obj); // { "0": "a", "1": "b", "2": "c" }

Une exception interrompra les tâches de copie suivantes

var target = Object.defineProperty({}, "foo", {
    value: 1,
    writable: false
}); // target 的 foo 属性是个只读属性。

Object.assign(target, {bar: 2}, {foo2: 3, foo: 3, foo3: 3}, {baz: 4});
// TypeError: "foo" is read-only
// 注意这个异常是在拷贝第二个源对象的第二个属性时发生的。

console.log(target.bar);  // 2，说明第一个源对象拷贝成功了。
console.log(target.foo2); // 3，说明第二个源对象的第一个属性也拷贝成功了。
console.log(target.foo);  // 1，只读属性不能被覆盖，所以第二个源对象的第二个属性拷贝失败了。
console.log(target.foo3); // undefined，异常之后 assign 方法就退出了，第三个属性是不会被拷贝到的。
console.log(target.baz);  // undefined，第三个源对象更是不会被拷贝到的。

Accesseur de copie

var obj = {
  foo: 1,
  get bar() {
    return 2;
  }
};

var copy = Object.assign({}, obj); 
// { foo: 1, bar: 2 }
// copy.bar的值来自obj.bar的getter函数的返回值 
console.log(copy); 

// 下面这个函数会拷贝所有自有属性的属性描述符
function completeAssign(target, ...sources) {
  sources.forEach(source => {
    let descriptors = Object.keys(source).reduce((descriptors, key) => {
      descriptors[key] = Object.getOwnPropertyDescriptor(source, key);
      return descriptors;
    }, {});

    // Object.assign 默认也会拷贝可枚举的Symbols
    Object.getOwnPropertySymbols(source).forEach(sym => {
      let descriptor = Object.getOwnPropertyDescriptor(source, sym);
      if (descriptor.enumerable) {
        descriptors[sym] = descriptor;
      }
    });
    Object.defineProperties(target, descriptors);
  });
  return target;
}

var copy = completeAssign({}, obj);
console.log(copy);
// { foo:1, get bar() { return 2 } }

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!