js對象方法大全

JavaScript中Object構造函數的方法

Object構造函數的方法節

Object.assign()

通過復制一個或多個對象來創建一個新的對象。

Object.create()

使用指定的原型對象和屬性創建一個新對象。

Object.defineProperty()

給對象添加一個屬性並指定該屬性的配置。

Object.defineProperties()

給對象添加多個屬性並分別指定它們的配置。

Object.entries()

返回給定對象自身可枚舉屬性的[key, value]數組。

Object.freeze()

凍結對象：其他代碼不能刪除或更改任何屬性。

Object.is()

比較兩個值是否相同。所有 NaN 值都相等（這與==和===不同）。

Object.isExtensible()

判斷對象是否可擴展。

Object.isFrozen()

判斷對象是否已經凍結。

Object.isSealed()

判斷對象是否已經密封。

Object.keys()

返回一個包含所有給定對象自身可枚舉屬性名稱的數組。

Object.values()

返回給定對象自身可枚舉值的數組。

1、Object.assign() 方法用於將所有可枚舉屬性的值從一個或多個源對象復制到目標對象。它將返回目標對象。

 
const target = { a: 1, b: 2 };
 
const source = { b: 4, c: 5 };
 
const returnedTarget = Object.assign(target, source);
 
console.log(target);
 
// expected output: Object { a: 1, b: 4, c: 5 }
 
console.log(returnedTarget);
 
// expected output: Object { a: 1, b: 4, c: 5 }

 

2、Object.create()方法創建一個新對象，使用現有的對象來提供新創建的對象的__proto__。 

 
const person = {
 
  isHuman: false,
 
  printIntroduction: function () {
 
    console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
 
  }
 
};
 
 
 
const me = Object.create(person);
 
 
 
me.name = "Matthew"; // "name" is a property set on "me", but not on "person"
 
me.isHuman = true; // inherited properties can be overwritten
 
 
 
me.printIntroduction();
 
// expected output: "My name is Matthew. Am I human? true"

3、Object.defineProperties() 方法直接在一個對象上定義新的屬性或修改現有屬性，並返回該對象。

     語法   Object.defineProperties(obj, props)   obj在其上定義或修改屬性的對象。props要定義其可枚舉屬性或修改的屬性描述符的對象。對象中存在的屬性描述符主要有兩種：數據描述符和訪問器描述符（更多詳情，請參閱Object.defineProperty()）。描述符具有以下鍵：configurabletrue 當且僅當該屬性描述符的類型可以被改變並且該屬性可以從對應對象中刪除。 默認為 falseenumerabletrue 當且僅當在枚舉相應對象上的屬性時該屬性顯現。 默認為 falsevalue與屬性關聯的值。可以是任何有效的JavaScript值（數字，對象，函數等）。 默認為 undefined.writabletrue當且僅當與該屬性相關聯的值可以用assignment operator改變時。 默認為 falseget作為該屬性的 getter 函數，如果沒有 getter 則為undefined。函數返回值將被用作屬性的值。 默認為 undefinedset作為屬性的 setter 函數，如果沒有 setter 則為undefined。函數將僅接受參數賦值給該屬性的新值。 默認為 undefined返回值節 傳遞給函數的對象。

 
var obj = {};
 
Object.defineProperties(obj, {
 
'property1': {
 
value: true,
 
writable: true
 
},
 
'property2': {
 
value: 'Hello',
 
writable: false
 
}
 
// etc. etc.
 
});

4、Object.defineProperty() 方法會直接在一個對象上定義一個新屬性，或者修改一個對象的現有屬性， 並返回這個對象。

    語法 Object.defineProperty(obj, prop, descriptor)      obj要在其上定義屬性的對象。prop要定義或修改的屬性的名稱。descriptor將被定義或修改的屬性描述符。返回值節    被傳遞給函數的對象。在ES6中，由於 Symbol類型的特殊性，用Symbol類型的值來做對象的key與常規的定義或修改不同，而Object.defineProperty 是定義key為Symbol的屬性的方法之一。

5、Object.entries()方法返回一個給定對象自身可枚舉屬性的鍵值對數組，其排列與使用 for...in 循環遍歷該對象時返回的順序一致（區別在於 for-in 循環也枚舉原型鏈中的屬性）

 

 
const object1 = { foo: 'bar', baz: 42 };
 
console.log(Object.entries(object1)[1]);
 
// expected output: Array ["baz", 42]
 
 
 
const object2 = { 0: 'a', 1: 'b', 2: 'c' };
 
console.log(Object.entries(object2)[2]);
 
// expected output: Array ["2", "c"]
 
 
 
const result = Object.entries(object2).sort((a, b) => a - b);
 
console.log(Object.entries(result)[1]);
 
// expected output: Array ["1", Array ["1", "b"]]

 

6、Object.freeze() 方法可以凍結一個對象。一個被凍結的對象再也不能被修改；凍結了一個對象則不能向這個對象添加新的屬性，不能刪除已有屬性，不能修改該對象已有屬性的可枚舉性、可配置性、可寫性，以及不能修改已有屬性的值。此外，凍結一個對象后該對象的原型也不能被修改。freeze() 返回和傳入的參數相同的對象。

 
const object1 = {
 
property1: 42
 
};
 
 
 
const object2 = Object.freeze(object1);
 
 
 
object2.property1 = 33;
 
// Throws an error in strict mode
 
 
 
console.log(object2.property1);
 
// expected output: 42

7、Object.fromEntries() 把鍵值對列表轉換為一個對象。

 

 
Map 轉化為 Object
 
通過 Object.fromEntries， 可以將 Map 轉化為 Object:
 
 
 
const map = new Map([ ['foo', 'bar'], ['baz', 42] ]);
 
const obj = Object.fromEntries(map);
 
console.log(obj); // { foo: "bar", baz: 42 }
 
 
 
Array 轉化為 Object
 
通過 Object.fromEntries， 可以將 Array 轉化為 Object:
 
 
 
const arr = [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ];
 
const obj = Object.fromEntries(arr);
 
console.log(obj); // { 0: "a", 1: "b", 2: "c" }
 
對象轉換為Object
 
Object.fromEntries 是 Object.entries() 的反轉函數， 借用 array manipulation methods 可以轉換對象，如下：
 
 
 
const object1 = { a: 1, b: 2, c: 3 };
 
 
 
const object2 = Object.fromEntries(
 
Object.entries(object1)
 
.map(([ key, val ]) => [ key, val * 2 ])
 
);
 
 
 
console.log(object2);
 
// { a: 2, b: 4, c: 6 }

 

 

 

8、Object.is() 方法判斷兩個值是否是相同的值

 

 
Object.is('foo', 'foo'); // true
 
Object.is(window, window); // true
 
 
 
Object.is('foo', 'bar'); // false
 
Object.is([], []); // false
 
 
 
var foo = { a: 1 };
 
var bar = { a: 1 };
 
Object.is(foo, foo); // true
 
Object.is(foo, bar); // false
 
 
 
Object.is(null, null); // true
 
 
 
// 特例
 
Object.is(0, -0); // false
 
Object.is(-0, -0); // true
 
Object.is(NaN, 0/0); // true

 

9、Object.isFrozen()方法判斷一個對象是否被凍結

 

 
// 使用Object.freeze是凍結一個對象最方便的方法.
 
var frozen = { 1: 81 };
 
Object.isFrozen(frozen) //=== false
 
Object.freeze(frozen);
 
Object.isFrozen(frozen) //=== true
 
 
 
// 一個凍結對象也是一個密封對象.
 
Object.isSealed(frozen) //=== true
 
 
 
// 當然,更是一個不可擴展的對象.
 
Object.isExtensible(frozen) //=== false
 
在 ES5 中，如果參數不是一個對象類型，將拋出一個TypeError異常。在 ES2015 中，非對象參數將被視為一個凍結的普通對象，因此會返回true。
 
 
 
Object.isFrozen(1);
 
// TypeError: 1 is not an object (ES5 code)
 
 
 
Object.isFrozen(1);
 
// true (ES2015 code)

 

10、Object.keys() 方法會返回一個由一個給定對象的自身可枚舉屬性組成的數組，數組中屬性名的排列順序和使用 for...in 循環遍歷該對象時返回的順序一致 。

 

 
// simple array
 
var arr = ['a', 'b', 'c'];
 
console.log(Object.keys(arr)); // console: ['0', '1', '2']
 
 
 
// array like object
 
var obj = { 0: 'a', 1: 'b', 2: 'c' };
 
console.log(Object.keys(obj)); // console: ['0', '1', '2']
 
 
 
// array like object with random key ordering
 
var anObj = { 100: 'a', 2: 'b', 7: 'c' };
 
console.log(Object.keys(anObj)); // console: ['2', '7', '100']
 
 
 
// getFoo is a property which isn't enumerable
 
var myObj = Object.create({}, {
 
getFoo: {
 
value: function () { return this.foo; }
 
}
 
});
 
myObj.foo = 1;
 
console.log(Object.keys(myObj)); // console: ['foo']

 

 

 

11、Object.values()方法返回一個給定對象自身的所有可枚舉屬性值的數組，值的順序與使用for...in循環的順序相同 ( 區別在於 for-in 循環枚舉原型鏈中的屬性 )。

 
var obj = { foo: 'bar', baz: 42 };
 
console.log(Object.values(obj)); // ['bar', 42]
 
 
 
// array like object
 
var obj = { 0: 'a', 1: 'b', 2: 'c' };
 
console.log(Object.values(obj)); // ['a', 'b', 'c']
 
 
 
// array like object with random key ordering
 
// when we use numeric keys, the value returned in a numerical order according to the keys
 
var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
 
console.log(Object.values(an_obj)); // ['b', 'c', 'a']
 
 
 
// getFoo is property which isn't enumerable
 
var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
 
my_obj.foo = 'bar';
 
console.log(Object.values(my_obj)); // ['bar']
 
 
 
// non-object argument will be coerced to an object
 
console.log(Object.values('foo')); // ['f', 'o', 'o']