var data = {};
var b = $.isEmptyObject(data); //true

判斷是否為空對(duì)象在實(shí)際開發(fā)中很常見，今天就讓我們來整理一下有哪些方法吧。

1、空對(duì)象對(duì)應(yīng)的字符串為 "{}"

var data = {};
var b = JSON.stringify(data) == "{}";
console.log(b); // true

2、for in

var obj = {};
var b = function () {
  for (var key in obj) {
    return false;
  }
  return true;
};
console.log(b()); //true

3、jquery 的 isEmptyObject()方法

這個(gè)方法是對(duì)第二個(gè)方法的封裝。

var data = {};
var b = $.isEmptyObject(data);
console.log(b); //true

4、Object.getOwnPropertyNames()

Object 對(duì)象的 getOwnPropertyNames 方法，獲取到對(duì)象中的屬性名，存到一個(gè)數(shù)組中，返回?cái)?shù)組對(duì)象，我們可以通過判斷數(shù)組的 length 來判斷此對(duì)象是否為空。

var data = {};
var arr = Object.getOwnPropertyNames(data);
console.log(arr.length == 0); // true

5、ES6 的 Object.keys()

此方法也是返回對(duì)象中屬性名組成的數(shù)組。

var data = {};
var arr = Object.keys(data);
console.log(arr.length == 0); // true

JSON.stringify()擴(kuò)展

JSON.stringify() 方法用于將 JavaScript 值轉(zhuǎn)換為 JSON 字符串。

語法：

JSON.stringify(value[, replacer[, space]])

參數(shù)說明：

• value：必需，要轉(zhuǎn)換的 JavaScript 值（通常為對(duì)象或數(shù)組）。
• replacer: 可選。用于轉(zhuǎn)換結(jié)果的函數(shù)或數(shù)組。 如果 replacer 為函數(shù)，則 JSON.stringify 將調(diào)用該函數(shù)，并傳入每個(gè)成員的鍵和值。使用返回值而不是原始值。 如果此函數(shù)返回 undefined，則排除成員。根對(duì)象的鍵是一個(gè)空字符串：""。如果 replacer 是一個(gè)數(shù)組，則僅轉(zhuǎn)換該數(shù)組中具有鍵值的成員。成員的轉(zhuǎn)換順序與鍵在數(shù)組中的順序一樣。
• space：可選，文本添加縮進(jìn)、空格和換行符，如果 space 是一個(gè)數(shù)字，則返回值文本在每個(gè)級(jí)別縮進(jìn)指定數(shù)目的空格，如果 space 大于 10，則文本縮進(jìn) 10 個(gè)空格。space 也可以使用非數(shù)字，如：\t。
• 返回值：返回包含 JSON 文本的字符串。

JSON.stringify()特性挺多的，具體如下：

1、第一大特性

對(duì)于 undefined、任意的函數(shù)以及 symbol 三個(gè)特殊的值分別作為對(duì)象屬性的值、數(shù)組元素、單獨(dú)的值時(shí) JSON.stringify() 將返回不同的結(jié)果。 來看這道題：

const data = {
  a: "aaa",
  b: undefined,
  c: Symbol("dd"),
  fn: function () {
    return true;
  },
};
JSON.stringify(data); // 輸出：？
// "{"a":"aaa"}"

這是因?yàn)?undefined、任意的函數(shù)以及 symbol 作為對(duì)象屬性值時(shí) JSON.stringify() 將跳過（忽略）對(duì)它們進(jìn)行序列化。

假設(shè) undefined、任意的函數(shù)以及 symbol 值作為數(shù)組元素會(huì)是怎樣呢？

JSON.stringify([
  "aaa",
  undefined,
  function aa() {
    return true;
  },
  Symbol("dd"),
]); // 輸出：？
// "["aaa",null,null,null]"

這是因?yàn)?undefined、任意的函數(shù)以及 symbol 作為數(shù)組元素值時(shí)，JSON.stringify() 會(huì)將它們序列化為 null。

還有，undefined、任意的函數(shù)以及 symbol 被 JSON.stringify() 作為單獨(dú)的值進(jìn)行序列化時(shí)都會(huì)返回 undefined。

JSON.stringify(function a() {
  console.log("a");
});
// undefined
JSON.stringify(undefined);
// undefined
JSON.stringify(Symbol("dd"));
// undefined

小結(jié)

• undefined、任意的函數(shù)以及 symbol 作為對(duì)象屬性值時(shí) JSON.stringify() 對(duì)跳過（忽略）它們進(jìn)行序列化。
• undefined、任意的函數(shù)以及 symbol 作為數(shù)組元素值時(shí)，JSON.stringify() 將會(huì)將它們序列化為 null。
• undefined、任意的函數(shù)以及 symbol 被 JSON.stringify() 作為單獨(dú)的值進(jìn)行序列化時(shí)，都會(huì)返回 undefined。

2、第二大特性

非數(shù)組對(duì)象的屬性不能保證以特定的順序出現(xiàn)在序列化后的字符串中。因?yàn)?JSON.stringify() 序列化時(shí)會(huì)忽略一些特殊的值，所以不能保證序列化后的字符串還是以特定的順序出現(xiàn)（數(shù)組除外）。

const data = {
  a: "aaa",
  b: undefined,
  c: Symbol("dd"),
  fn: function () {
    return true;
  },
  d: "ddd",
};
JSON.stringify(data); // 輸出：？
// "{"a":"aaa","d":"ddd"}"
JSON.stringify([
  "aaa",
  undefined,
  function aa() {
    return true;
  },
  Symbol("dd"),
  "eee",
]); // 輸出：？
// "["aaa",null,null,null,"eee"]"

3、第三大特性

轉(zhuǎn)換值如果有 toJSON() 函數(shù)，該函數(shù)返回什么值，序列化結(jié)果就是什么值，并且忽略其他屬性的值。

JSON.stringify({
    say: "hello JSON.stringify",
    toJSON: function() {
      return "today i learn";
    }
  })
// "today i learn"

4、第四大特性

JSON.stringify() 將會(huì)正常序列化 Date 的值。

JSON.stringify({ now: new Date() });
// "{"now":"2019-12-08T07:42:11.973Z"}"

5、第五大特性

NaN 和 Infinity 格式的數(shù)值及 null 都會(huì)被當(dāng)做 null。

JSON.stringify(NaN)
// "null"
JSON.stringify(null)
// "null"
JSON.stringify(Infinity)
// "null"

6、第六大特性

布爾值、數(shù)字、字符串的包裝對(duì)象在序列化過程中會(huì)自動(dòng)轉(zhuǎn)換成對(duì)應(yīng)的原始值。

JSON.stringify([new Number(1), new String("false"), new Boolean(false)]);
// "[1,"false",false]"

7、第七大特性

其他類型的對(duì)象，包括 Map/Set/WeakMap/WeakSet，僅會(huì)序列化可枚舉的屬性。

// 不可枚舉的屬性默認(rèn)會(huì)被忽略：
JSON.stringify( 
    Object.create(
        null, 
        { 
            x: { value: 'json', enumerable: false }, 
            y: { value: 'stringify', enumerable: true } 
        }
    )
);
// "{"y":"stringify"}"

8、第八大特性

深拷貝最粗暴的方式是JSON.parse(JSON.stringify())，這個(gè)方式實(shí)現(xiàn)深拷貝會(huì)因?yàn)樾蛄谢闹T多特性從而導(dǎo)致諸多的坑點(diǎn)：比如現(xiàn)在我們要說的循環(huán)引用問題。

// 對(duì)包含循環(huán)引用的對(duì)象（對(duì)象之間相互引用，形成無限循環(huán)）執(zhí)行此方法，會(huì)拋出錯(cuò)誤。 
const obj = {
  name: "loopObj"
};
const loopObj = {
  obj
};
// 對(duì)象之間形成循環(huán)引用，形成閉環(huán)
obj.loopObj = loopObj;
// 封裝一個(gè)深拷貝的函數(shù)
function deepClone(obj) {
  return JSON.parse(JSON.stringify(obj));
}
// 執(zhí)行深拷貝，拋出錯(cuò)誤
deepClone(obj)
/**
 VM44:9 Uncaught TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'Object'
    |     property 'loopObj' -> object with constructor 'Object'
    --- property 'obj' closes the circle
    at JSON.stringify (<anonymous>)
    at deepClone (<anonymous>:9:26)
    at <anonymous>:11:13
 */

總結(jié)

到此這篇關(guān)于JavaScript判斷對(duì)象是否為空對(duì)象的幾種常見方法的文章就介紹到這了,更多相關(guān)js判斷對(duì)象為空對(duì)象內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論