Object對象

屬性

  • Object.prototype: Object的原型對象。

方法

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

語法: Object.assign(target, ...sources)

target 目標對象。
sources 源對象。

返回值: 目標對象

Object.assign
會跳過那些值為 null或 undefined的源對象。

不能解決深拷貝的問題

合并對象

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 }, 注意目標對象自身也會改變。

合并相同屬性的對象

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 }
Object.create() 方法會使用指定的原型對象及其屬性去創建一個新的對象。

語法:Object.create(proto[, propertiesObject])

proto 新創建對象的原型對象。

propertiesObject 可選。如果沒有指定為undefined,則是要添加到新創建對象的可枚舉屬性(即其自身定義的屬性,而不是其原型鏈上的枚舉屬性)對象的屬性描述符以及相應的屬性名稱。這些屬性對應Object.defineProperties()的第二個參數。

返回值: 在指定原型對象上添加新屬性后的對象。

如果propertiesObject參數不是 null或一個對象,則拋出一個 TypeError異常。

實現類式繼承

function Shape() {
  this.x = 0;
  this.y = 0;
}

Shape.prototype.move = function(x, y) {
  this.x += x;
  this.y += y;
  console.info('Shape moved.');
};

function Rectangle() {
  Shape.call(this); // call super constructor.
}

Rectangle.prototype = Object.create(Shape.prototype);
Rectangle.prototype.constructor = Rectangle;

var rect = new Rectangle();

console.log('Is rect an instance of Rectangle?',
  rect instanceof Rectangle); // true
console.log('Is rect an instance of Shape?',
  rect instanceof Shape); // true
rect.move(1, 1); // Outputs, 'Shape moved.'

當繼承多個對象時:

function MyClass() {
     SuperClass.call(this);
     OtherSuperClass.call(this);
}

MyClass.prototype = Object.create(SuperClass.prototype);

Object.assign(MyClass.prototype, OtherSuperClass.prototype);

MyClass.prototype.constructor = MyClass;

MyClass.prototype.myMethod = function() {
     // do a thing
};
var o;

// 創建一個原型為null的空對象
o = Object.create(null);


o = {};
// 以字面量方式創建的空對象就相當于:
o = Object.create(Object.prototype);


o = Object.create(Object.prototype, {
  // foo會成為所創建對象的數據屬性
  foo: { 
    writable:true,
    configurable:true,
    value: "hello" 
  },
  // bar會成為所創建對象的訪問器屬性
  bar: {
    configurable: false,
    get: function() { return 10 },
    set: function(value) {
      console.log("Setting `o.bar` to", value);
    }
  }
});


function Constructor(){}
o = new Constructor();
// 上面的一句就相當于:
o = Object.create(Constructor.prototype);
// 當然,如果在Constructor函數中有一些初始化代碼,Object.create不能執行那些代碼


// 創建一個以另一個空對象為原型,且擁有一個屬性p的對象
o = Object.create({}, { p: { value: 42 } })

// 省略了的屬性特性默認為false,所以屬性p是不可寫,不可枚舉,不可配置的:
o.p = 24
o.p
//42

o.q = 12
for (var prop in o) {
   console.log(prop)
}
//"q"

delete o.p
//false

//創建一個可寫的,可枚舉的,可配置的屬性p
o2 = Object.create({}, {
  p: {
    value: 42, 
    writable: true,
    enumerable: true,
    configurable: true 
  } 
});
Object.defineProperties() 方法直接在一個對象上定義新的屬性或修改現有屬性,并返回該對象。

語法: Object.defineProperties(obj, props)

返回值: 傳遞給函數的對象

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

語法: Object.entries(obj)

obj 可以返回其可枚舉屬性的鍵值對的對象。

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

const obj = { foo: 'bar', baz: 42 };
console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]

Object.entries(obj).forEach(([key, value]) => {
  console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
});

轉為map
var obj = { foo: "bar", baz: 42 }; 
var map = new Map(Object.entries(obj));
console.log(map); // Map { foo: "bar", baz: 42 }
Object.freeze() 方法可以凍結一個對象,凍結指的是不能向這個對象添加新的屬性,不能修改其已有屬性的值,不能刪除已有屬性,以及不能修改該對象已有屬性的可枚舉性、可配置性、可寫性。也就是說,這個對象永遠是不可變的。該方法返回被凍結的對象。

語法: Object.freeze(obj)

obj 要被凍結的對象。
返回值 被凍結的對象。

Object.getOwnPropertyDescriptor() 方法返回指定對象上一個自有屬性對應的屬性描述符。(自有屬性指的是直接賦予該對象的屬性,不需要從原型鏈上進行查找的屬性)

語法: Object.getOwnPropertyDescriptor(obj, prop)

obj 需要查找的目標對象
prop 目標對象內屬性名稱(String類型),加引號。

返回值: 如果改屬性直接存在于對象上,返回,否則返回undefined。

  class Point {
    constructor (x, y) {
      this.x = x;
      this.y = y;
    }

    toString () {
      console.log(this.x + this.y);
    }
  }

  let p = new Point(1, 'y');
  let a = Object.getOwnPropertyDescriptor(p, 'x');
  console.log(a)
Object.getOwnPropertyDescriptor

ES6中,如果第一個參數不是一個對象,就會強制轉換成一個對象,在ES5會報錯。

Object.getOwnPropertyDescriptors() 方法用來獲取一個對象的所有自身屬性的描述符。

如果沒有任何自身屬性,則返回空對象。

Object.getOwnPropertyNames()方法返回一個由指定對象的所有自身屬性的屬性名(包括不可枚舉屬性但不包括Symbol值作為名稱的屬性)組成的數組。
var obj = { 0: "a", 1: "b", 2: "c"};
console.log(Object.getOwnPropertyNames(obj).sort()); // ["0", "1", "2"]
Object.getOwnPropertySymbols() 方法會返回一個數組,該數組包含了指定對象自身的(非繼承的)所有 symbol 屬性鍵。
Object.getPrototypeOf() 方法返回指定對象的原型(內部[[Prototype]]屬性的值)。

如果沒有繼承屬性,返回null

var proto = {};
var obj = Object.create(proto);
Object.getPrototypeOf(obj) === proto; // true
Object.is()方法判斷兩個值是否是相同的值。

語法: Object.is(value1, value2);

返回一個Boolean值。

比較

與==區別: 不會隱式轉換類型

與===區別: 不會把+0和-0視為相等,并且可以認為NaN等于NaN。

Object.keys() 方法會返回一個由一個給定對象的自身可枚舉屬性組成的數組,數組中屬性名的排列順序和使用 for...in循環遍歷該對象時返回的順序一致 (兩者的主要區別是 一個 for-in 循環還會枚舉其原型鏈上的屬性)。
let arr = ["a", "b", "c"];
console.log(Object.keys(arr)); 
// ['0', '1', '2']

let anObj = { 100: 'a', 2: 'b', 7: 'c' }; 
console.log(Object.keys(anObj)); 
// ['2', '7', '100']

Object.values()

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

var obj = { foo: "bar", baz: 42 };
console.log(Object.values(obj)); // ['bar', 42]
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容