标签：妙用 stringify obj age JSON let null

描述

JSON.stringify()的作用就是把 JavaScript 对象或数组或其他简单值转换为字符串。它还可以用于对象的深拷贝；对 JSON 字符串进行格式化（缩进）；在转换之前对值进行替换操作。

特殊类型的处理

JSON.stringify()遇到函数、日期等类型的值会进行特殊处理。为了让输出结果好看一些，在函数的第三个参数，指明字符串化后的结果缩进 2 个空格：

let jsonStr = JSON.stringify(
  {
    func: function () {},
    date: new Date(),
    unde: undefined,
    null: null,
    nan: NaN,
    infi: Infinity,
    infi0: -Infinity,
    regp: new RegExp(/Android|iPad/)
  },
  null,
  2
);

console.log(jsonStr);

输出结果如下所示：

{
  "date": "2022-08-31T13:34:25.223Z",
  "null": null,
  "nan": null,
  "infi": null,
  "infi0": null,
  "regp": {}
}

JSON.stringify()对以下类型的值进行特殊处理：

1. 函数：函数直接被忽略，不输出到字符串中。
2. Date：原本 new 一个日期的结果时 "Wed Aug 31 2022 21:38:37 GMT+0800 (中国标准时间)"，在被字符串化之后变成了如上格式。
3. undefined：undefined 直接被忽略，不输出。
4. null：null 就是 null 本身。
5. NaN：Nan 类型被转化成 null。
6. Infinity 和 -Infinity：都被转化成 null。
7. RegExp：RegExp 直接输出一个空对象 {}。

运用场景

对象深拷贝

通过=无法真正拷贝一个对象，而是引用对象的内存地址，详细请看JavaScript - 对象引用和复制。

JSON.stringify()和JSON.parse()一起搭配使用就可以深拷贝一个对象：

let obj = { age: 10, name: "XiaoMing" };
let copy = JSON.parse(JSON.stringify(obj));

obj.age = 12;
copy.age = 14;

console.log(obj.age, copy.age); // => 12, 14

修改原对象obj的 age 属性之后不影响深拷贝之后的对象copy的属性。

存储对象到 LocalStorage

window.localStorage.setItem(key, value)的两个参数都只接受字符串类型的值，如果强行把对象、数组存储到本地存储里面，最终的结果是：

所以，这时候就不得不把对象、数组进行字符化，也就是用JSON.stringify()：

let obj = { age: 10, name: "XiaoMing" };
window.localStorage.setItem("obj", JSON.stringify(obj));

然后就能正常显示出对象了：

如果从本地存储中拿这个值，不要忘记用JSON.parse()解析字符串。

第二个参数

第二个参数可以传递一个函数也可以传递一个数组，每一种类型都有不同的作用。传递函数我们可以对原对象做一个过滤处理或者其他的操作，传递数组就是输出结果只保留数组里面给的那几个 key 以及对应的值。

传递函数

函数接收两个值，key 和 value。key 不可以被改变，value 可以改变，且在改变之后必须要把 value 返回出去，否则无法执行下一步，导致最终只输出一个空。

let obj = { age: 10, name: "XiaoMing" };
let json = JSON.stringify(obj, (key, value) => {
  if (key === "age") {
    value = 20;
  }
  return value;
});
console.log(json);

打印结果：

传递数组

对于输出结果，我们要进行一些取舍，就可以传递一个数组，指定只输出哪些 key 和 value：

let obj = { age: 10, name: "XiaoMing" };
let json = JSON.stringify(obj, ["age"]);
console.log(json);

打印结果：

那如果希望字符化后的对象只保留除了一些 key 以外的所有其他 key 和 value 呢？我写了一个exclude函数，只针对于对象，去除不需要的对象字段，其余都保留输出：

function exclude(obj, exc) {
  for (let i in exc) {
    delete obj[exc[i]];
  }
  return Object.keys(obj);
}

let obj = { age: 10, name: "XiaoMing", school: "希望小学", address: "北京市朝阳区xxx号" };

let json = JSON.stringify(obj, exclude(obj, ["age", "address"]));

打印结果：

第三个参数

默认打印输出的 JSON 字符串是一行，没有任何缩进的，第三个参数就是缩进多少个空格。

JSON.stringify(obj, exclude(obj, ["age", "address"]), 2);

缩进 2 个字符的结果：

{
  "name": "XiaoMing",
  "school": "希望小学"
}

标签：妙用,stringify,obj,age,JSON,let,null
来源： https://www.cnblogs.com/Enziandom/p/16644730.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。