const stu = {
    name: 'zcxiaobao',
    age: 18
}

// {"name":"zcxiaobao","age":18}
console.log(JSON.stringify(stu));

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

// repalcer 接受兩個(gè)參數(shù) key value
// key value 分別為對象的每個(gè)鍵值對
// 因此我們可以根據(jù)鍵或者值的類型進(jìn)行簡單篩選
function replacer(key, value) {
  if (typeof value === "string") {
    return undefined;
  }
  return value;
}
// function 可自己測試
function replacerFunc(key, value) {
  if (typeof value === "string") {
    return () => {};
  }
  return value;
}
const foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
const jsonString = JSON.stringify(foo, replacer);

const list = [1, '22', 3]
const jsonString = JSON.stringify(list, replacer)

const foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7};
const jsonString = JSON.stringify(foo, ['week', 'month']);

// 1. 對象屬性值中存在這三種值會(huì)被忽略
const obj = {
  name: 'zc',
  age: 18,
  // 函數(shù)會(huì)被忽略
  sayHello() {
    console.log('hello world')
  },
  // undefined會(huì)被忽略
  wife: undefined,
  // Symbol值會(huì)被忽略
  id: Symbol(111),
  // [Symbol('zc')]: 'zc',
}
// 輸出結(jié)果: {"name":"zc","age":18}
console.log(JSON.stringify(obj));

// 2. 數(shù)組中這三種值會(huì)被轉(zhuǎn)化為 null
const list = [
  'zc', 
  18, 
  // 函數(shù)轉(zhuǎn)化為 null
  function sayHello() {
    console.log('hello world')
  }, 
  // undefined 轉(zhuǎn)換為 null
  undefined, 
  // Symbol 轉(zhuǎn)換為 null
  Symbol(111)
]

// ["zc",18,null,null,null]
console.log(JSON.stringify(list))

// 3. 這三種值單獨(dú)轉(zhuǎn)化將會(huì)返回 undefined

console.log(JSON.stringify(undefined))  // undefined
console.log(JSON.stringify(Symbol(111))) // undefined
console.log(JSON.stringify(function sayHello() { 
  console.log('hello world')
})) // undefined

const obj = {
  name: 'zc',
  toJSON(){
    return 'return toJSON'
  }
}
// return toJSON
console.log(JSON.stringify(obj));

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

// [null,null,null,null,null]
JSON.stringify([null, NaN, -NaN, Infinity, -Infinity])

// 特性三講過布爾值、數(shù)字、字符串的包裝對象在序列化過程中會(huì)自動(dòng)轉(zhuǎn)換成對應(yīng)的原始值
// 隱式類型轉(zhuǎn)換就會(huì)調(diào)用包裝類，因此會(huì)先調(diào)用 Number => NaN
// 之后再轉(zhuǎn)化為 null
// 1/0 => Infinity => null
JSON.stringify([Number('123a'), +'123a', 1/0])

// "2022-03-06T08:24:56.138Z"
JSON.stringify(new Date())

const obj = {
  name: 'zcxiaobao',
  age: 18,
  [Symbol('lyl')]: 'unique'
}
function replacer(key, value) {
  if (typeof key === 'symbol') {
    return value;
  }
}

// undefined
JSON.stringify(obj, replacer);

const bigNumber = BigInt(1)
// Uncaught TypeError: Do not know how to serialize a BigInt
console.log(JSON.stringify(bigNumber))

const obj = {
  name: 'zcxiaobao',
  age: 18,
}

const loopObj = {
  obj
}
// 形成循環(huán)引用
obj.loopObj = loopObj;
JSON.stringify(obj)

/* 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 <anonymous>:10:6
*/

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

const obj = {
  name: 'zcxiaobao',
  age: 18
}
// 單純調(diào)用 localStorage.setItem()

localStorage.setItem('zc', obj);

// 最終返回結(jié)果是 [object Object]
// 可見單純調(diào)用localStorage是失敗的
console.log(localStorage.getItem('zc'))

localStorage.setItem('zc', JSON.stringify(obj));

// 最終返回結(jié)果是 {name: 'zcxiaobao', age: 18}
console.log(JSON.parse(localStorage.getItem('zc')))

// 我們只需要 a,e,f 屬性
const obj = {
  a:1, b:2, c:3, d:4, e:5, f:6, g:7
}
// 解構(gòu)賦值
const {a,e,f} = obj;
// 存儲(chǔ)到localStorage
localStorage.setItem('zc', JSON.stringify({a,e,f}))
// {"a":1,"e":5,"f":6}
console.log(localStorage.getItem('zc'))

// 借助 replacer 作為數(shù)組形式進(jìn)行過濾
localStorage.setItem('zc', JSON.stringify(obj, ['a','e','f']))
// {"a":1,"e":5,"f":6}
console.log(localStorage.getItem('zc'))

const ObjectMap = (obj, fn) => {
  if (typeof fn !== "function") {
    throw new TypeError(`${fn} is not a function !`);
  }
  // 先調(diào)用 JSON.stringify(obj, replacer) 實(shí)現(xiàn) map 功能
  // 然后調(diào)用 JSON.parse 重新轉(zhuǎn)化成對象
  return JSON.parse(JSON.stringify(obj, fn));
};

// 例如下面給 obj 對象的屬性值乘以2

const obj = {
  a: 1,
  b: 2,
  c: 3
}
console.log(ObjectMap(obj, (key, val) => {
  if (typeof value === "number") {
    return value * 2;
  }
  return value;
}))

const obj = {
  name: 'zcxiaobao',
  age: 18
}
// {"age":18}
JSON.stringify(obj, (key, val) => {
  // 返回值為 undefined時(shí)，該屬性會(huì)被忽略 
  if (key === 'name') {
    return undefined;
  }
  return val;
})

//判斷數(shù)組是否包含某對象
const names = [
  {name:'zcxiaobao'},
  {name:'txtx'},
  {name:'mymy'},
];
const zcxiaobao = {name:'zcxiaobao'};
// true
JSON.stringify(names).includes(JSON.stringify(zcxiaobao))
 
// 判斷對象是否相等
const d1 = {type: 'div'}
const d2 = {type: 'div'}

// true
JSON.stringify(d1) === JSON.stringify(d2);

arr.forEach(item => {
  const newItem = {};
  Object.keys(item)   // 獲取對象鍵值
        .sort()       // 鍵值排序
        .map(key => { // 生成新對象
          newItem[key] = item[key];
        })
  // 使用 newItem 進(jìn)行去重操作
})

function unique(arr) {
  const keySet = new Set();
  const uniqueObj = {}
  // 提取所有的鍵
  arr.forEach(item => {
    Object.keys(item).forEach(key => keySet.add(key))
  })
  const replacer = [...keySet];
  arr.forEach(item => {
    // 所有的對象按照規(guī)定鍵值 replacer 過濾
    unique[JSON.stringify(item, replacer)] = item;
  })
  return Object.keys(unique).map(u => JSON.parse(u))
}

// 測試一下
unique([{}, {}, 
      {x:1},
      {x:1},
      {a:1},
      {x:1,a:1},
      {x:1,a:1},
      {x:1,a:1,b:1}
      ])

// 返回結(jié)果
[{},{"x":1},{"a":1},{"x":1,"a":1},{"x":1,"a":1,"b":1}]