JS Object對象 2019-08-21

概述

  • JavaScript 原生提供Object對象（注意起首的O是大寫）

  • JavaScript 的所有其他對象都繼承自Object對象，即那些對象都是Object的實例。

  • Object對象的原生方法分成兩類：

1、bject對象本身的方法
所謂“本身的方法”就是直接定義在Object對象的方法。

Object.print = function (o) { console.log(o) };

上面代碼中，print方法就是直接定義在Object對象上。

2、Object的實例方法
所謂實例方法就是定義在Object原型對象Object.prototype上的方法。它可以被Object實例直接使用。

Object.prototype.print = function () {
  console.log(this);
};

var obj = new Object();
obj.print() // Object

上面代碼中，Object.prototype定義了一個print方法，然后生成一個Object的實例obj。obj直接繼承了Object.prototype的屬性和方法，可以直接使用obj.print調用print方法。也就是說，obj對象的print方法實質上就是調用Object.prototype.print方法。

  • 凡是定義在Object.prototype對象上面的屬性和方法，將被所有實例對象共享。

Object()

  • Object()本身是一個函數，可以當作工具方法使用，將任意值轉為對象。這個方法常用于保證某個值一定是對象。
    如果參數為空（或者為undefined和null），Object()返回一個空對象。例：
var obj = Object();
// 等同于
var obj = Object(undefined);
var obj = Object(null);

obj instanceof Object // true

上面代碼的含義，是將undefined和null轉為對象，結果得到了一個空對象obj。

  • instanceof運算符
    instanceof運算符用來驗證，一個對象是否為指定的構造函數的實例。obj instanceof Object返回true，就表示obj對象是Object的實例。
  • 如果參數是原始類型的值，Object方法將其轉為對應的包裝對象的實例
var obj = Object(1);
obj instanceof Object // true
obj instanceof Number // true

var obj = Object('foo');
obj instanceof Object // true
obj instanceof String // true

var obj = Object(true);
obj instanceof Object // true
obj instanceof Boolean // true
  • 如果Object方法的參數是一個對象，它總是返回該對象，即不用轉換。

Object構造函數

  • Object可以當作構造函數使用，即前面可以使用new命令。
var obj = new Object();

Object構造函數的首要用途，是直接通過它來生成新對象

  • 通過var obj = new Object()的寫法生成新對象，與字面量的寫法var obj = {}是等價的。后者只是前者的一種簡便寫法。
  • Object構造函數使用時，可以接受一個參數，如果該參數是一個對象，則直接返回這個對象；如果是一個原始類型的值，則返回該值對應的包裝對象 
var o1 = {a: 1};
var o2 = new Object(o1);
o1 === o2 // true

var obj = new Object(123);
o
  • Object(value)與new Object(value)兩者的語義是不同的，Object(value)表示將value轉成一個對象，new Object(value)則表示新生成一個對象，它的值是value。

Object 的靜態(tài)方法

  • “靜態(tài)方法”，是指部署在Object對象自身的方法。

  • Object.keys() 、 Object.getOwnPropertyNames()

  • Object.keys() 、 Object.getOwnPropertyNames()都是用來遍歷對象的屬性

  • Object.keys方法的參數是一個對象，返回一個數組。該數組的成員都是該對象自身的（而不是繼承的）所有屬性名。

var obj = {
  p1: 123,
  p2: 456
};

Object.keys(obj) // ["p1", "p2"]
  • Object.getOwnPropertyNames方法與Object.keys類似，也是接受一個對象作為參數，返回一個數組，包含了該對象自身的所有屬性名。
var obj = {
  p1: 123,
  p2: 456
};

Object.getOwnPropertyNames(obj) // ["p1", "p2"]
  • Object.keys()和Object.getOwnPropertyNames()的區(qū)別：
    Object.keys方法只返回可枚舉的屬性
    Object.getOwnPropertyNames方法還返回不可枚舉的屬性名
var a = ['Hello', 'World'];

Object.keys(a) // ["0", "1"]
Object.getOwnPropertyNames(a) // ["0", "1", "length"]
//數組的length屬性是不可枚舉的屬性

對象屬性模型的相關方法

Object.getOwnPropertyDescriptor()：獲取某個屬性的描述對象。
Object.defineProperty()：通過描述對象，定義某個屬性。
Object.defineProperties()：通過描述對象，定義多個屬性。

控制對象狀態(tài)的方法

Object.preventExtensions()：防止對象擴展。
Object.isExtensible()：判斷對象是否可擴展。
Object.seal()：禁止對象配置。
Object.isSealed()：判斷一個對象是否可配置。
Object.freeze()：凍結一個對象。
Object.isFrozen()：判斷一個對象是否被凍結。

原型鏈相關方法

Object.create()：該方法可以指定原型對象和屬性，返回一個新的對象。
Object.getPrototypeOf()：獲取對象的Prototype對象。

Object 的實例方法

  • 定義在Object.prototype對象的方法，稱為實例方法,所有Object的實例對象都繼承了這些方法。
    Object實例對象的方法，主要有以下六個:
    1、Object.prototype.valueOf()：返回當前對象對應的值。
    2、Object.prototype.toString()：返回當前對象對應的字符串形式。
    3、Object.prototype.toLocaleString()：返回當前對象對應的本地字符串形式。
    4、Object.prototype.hasOwnProperty()：判斷某個屬性是當前對象自身的屬性，還是繼承自原型對象的屬性。
    5、Object.prototype.isPrototypeOf()：判斷當前對象是否為另一個對象的原型。
    6、Object.prototype.propertyIsEnumerable()：判斷某個屬性是否可枚舉。

1、Object.prototype.valueOf()

  • valueOf方法的作用是返回一個對象的“值”，默認情況下返回對象本身。
  • valueOf方法的主要用途是，JavaScript 自動類型轉換時會默認調用這個方法
var obj = new Object();
1 + obj // "1[object Object]"

上面代碼將對象obj與數字1相加，這時 JavaScript 就會默認調用valueOf()方法，求出obj的值再與1相加

  • 如果自定義valueOf方法，就可以得到想要的結果:
var obj = new Object();
obj.valueOf = function () {
  return 2;
};

1 + obj // 3

上面代碼自定義了obj對象的valueOf方法，于是1 + obj就得到了3。這種方法就相當于用自定義的obj.valueOf，覆蓋Object.prototype.valueOf。

2、Object.prototype.toString()

  • toString方法的作用是返回一個對象的字符串形式，默認情況下返回類型字符串。 
var o1 = new Object();
o1.toString() // "[object Object]"

var o2 = {a:1};
o2.toString() // "[object Object]"

上面代碼表示，對于一個對象調用toString方法，會返回字符串[object Object]，該字符串說明對象的類型。

  • 通過自定義toString方法，可以讓對象在自動類型轉換時，得到想要的字符串形式:
var obj = new Object();

obj.toString = function () {
  return 'hello';
};

obj + ' ' + 'world' // "hello world"

上面代碼表示，當對象用于字符串加法時，會自動調用toString方法。由于自定義了toString方法，所以返回字符串hello world

  • 數組、字符串、函數、Date 對象都分別部署了自定義的toString方法，覆蓋了Object.prototype.toString方法:
[1, 2, 3].toString() // "1,2,3"

'123'.toString() // "123"

(function () {
  return 123;
}).toString()
// "function () {
//   return 123;
// }"

(new Date()).toString()
// "Tue May 10 2016 09:11:31 GMT+0800 (CST)"

上面代碼中，數組、字符串、函數、Date 對象調用toString方法，并不會返回[object Object]，因為它們都自定義了toString方法，覆蓋原始方法。

2.1、toString的應用：判斷數據類型

  • Object.prototype.toString方法返回對象的類型字符串，因此可以用來判斷一個值的類型。
var obj = {};
obj.toString() // "[object Object]"

上面代碼調用空對象的toString方法，結果返回一個字符串object Object，其中第二個Object表示該值的構造函數
由于實例對象可能會自定義toString方法，覆蓋掉Object.prototype.toString方法，所以為了得到類型字符串，最好直接使用Object.prototype.toString方法
通過函數的call方法，可以在任意值上調用這個方法，幫助我們判斷這個值的類型:

Object.prototype.toString.call(value)
//表示對value這個值調用Object.prototype.toString方法。
  • 不同數據類型的Object.prototype.toString方法返回值如下:
    數值：返回[object Number]
    字符串：返回[object String]
    布爾值：返回[object Boolean]
    undefined：返回[object Undefined]
    null：返回object Null]
    數組：返回[object Array]
    arguments 對象：返回[object Arguments]
    函數：返回[object Function]
    Error 對象：返回[object Error]
    Date 對象：返回[object Date]
    RegExp 對象：返回[object RegExp]
    其他對象：返回[object Object] 
Object.prototype.toString.call(2) // "[object Number]"
Object.prototype.toString.call('') // "[object String]"
Object.prototype.toString.call(true) // "[object Boolean]"
Object.prototype.toString.call(undefined) // "[object Undefined]"
Object.prototype.toString.call(null) // "[object Null]"
Object.prototype.toString.call(Math) // "[object Math]"
Object.prototype.toString.call({}) // "[object Object]"
Object.prototype.toString.call([]) // "[object Array]"

3、Object.prototype.toLocaleString()

  • Object.prototype.toLocaleString方法與toString的返回結果相同，也是返回一個值的字符串形式。
var obj = {};
obj.toString(obj) // "[object Object]"
obj.toLocaleString(obj) // "[object Object]"
  • 這個方法的主要作用是留出一個接口，讓各種不同的對象實現自己版本的toLocaleString，用來返回針對某些地域的特定的值。
var person = {
  toString: function () {
    return 'Henry Norman Bethune';
  },
  toLocaleString: function () {
    return '白求恩';
  }
};

person.toString() // Henry Norman Bethune
person.toLocaleString() // 白求恩

上面代碼中，toString()方法返回對象的一般字符串形式，toLocaleString()方法返回本地的字符串形式。

4、Object.prototype.hasOwnProperty()

  • Object.prototype.hasOwnProperty方法接受一個字符串作為參數，返回一個布爾值，表示該實例對象自身是否具有該屬性。
var obj = {
  p: 123
};

obj.hasOwnProperty('p') // true
obj.hasOwnProperty('toString') // false

上面代碼中，對象obj自身具有p屬性，所以返回true。toString屬性是繼承的，所以返回false。

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發(fā)布，文章內容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 概述 JavaScript 原生提供Object對象。JavaScript 的所有其他對象都繼承自Object對象...
    oWSQo閱讀 281評論 0贊 1
  • 概述 JavaScript 原生提供Object對象（注意起首的O是大寫），本章介紹該對象原生的各種方法。 Jav...
    許先生__閱讀 476評論 0贊 3
  • 1 概述 JavaScript 的所有其他對象都繼承自Object對象，即那些對象都是Object的實例。 Obj...
    徵羽kid閱讀 285評論 0贊 0
  • 第5章 引用類型(返回首頁) 本章內容 使用對象 創(chuàng)建并操作數組 理解基本的JavaScript類型 使用基本類型...
    大學一百閱讀 3,268評論 0贊 4
  • 第3章 基本概念 3.1 語法 3.2 關鍵字和保留字 3.3 變量 3.4 數據類型 5種簡單數據類型：Unde...
    RickCole閱讀 5,149評論 0贊 21