1、将JS值转换为JSON字符串
const person = {
name : "Julian",
age : "18"
}
console.log(JSON.stringify(person)); // "{"name":"Julian","age":"18"}"
2、存储localStorage对象:存储用户创建的一个对象,并且即使在浏览器被关闭后仍能恢复该对象
// 创建一个示例数据
var session = {
screens : [],
state : true
};
session.screens.push({"name":"screenA", "width":450, "height":250});
session.screens.push({"name":"screenB", "width":650, "height":350});
session.screens.push({"name":"screenC", "width":750, "height":120});
session.screens.push({"name":"screenD", "width":250, "height":60});
session.screens.push({"name":"screenE", "width":390, "height":120});
session.screens.push({"name":"screenF", "width":1240, "height":650});
// 使用 JSON.stringify 转换为 JSON 字符串,然后使用 localStorage 保存在 session 名称里
localStorage.setItem('session', JSON.stringify(session));
// 使用 JSON.parse 转换为 JSON 对象
var restoredSession = JSON.parse(localStorage.getItem('session'));
console.log(restoredSession);
3、数组去重
function unique(arr){
let unique = {};
arr.forEach(function(item){
unique[JSON.stringify(item)] = item;//键名不会重复
})
arr = Object.keys(unique).map(function(u){
//Object.keys()返回对象的所有键值组成的数组,map方法是一个遍历方法,返回遍历结果组成的数组.将unique对象的键名还原成对象数组
return JSON.parse(u);
})
return arr;
}
var uniqeArray = unique([{name: 1,author: 2}, {author: 2,name:1}])
console.log(uniqeArray)
解析:但是像{x:1,y:2}与{y:2,x:1}这种通过上述方法变化后的值是不同的,但实际上它们是重复对象,可以通过下面方法解决,,即先把属性排序一下,再进行下一步操作:
function unique(arr) {
let unique = {};
arr.forEach(function(item) {
//调整属性顺序
var newData = {};
Object.keys(item).sort().map(key => {
newData[key] = item[key]
})
unique[JSON.stringify(newData)] = item; //键名不会重复
})
arr = Object.keys(unique).map(function(u) {
//Object.keys()返回对象的所有键值组成的数组,map方法是一个遍历方法,返回遍历结果组成的数组.将unique对象的键名还原成对象数组
return JSON.parse(u);
})
return arr;
}
var uniqeArray = unique([{name: 1,author: 2}, {author: 2,name:1}])
console.log(uniqeArray)
4、stringify 函数第二个参数的妙用
function unique(arr) {
let unique = {};
arr.forEach(function(item) {
unique[JSON.stringify(item,['name','author'])] = item;
})
arr = Object.keys(unique).map(function(u) {
//Object.keys()返回对象的所有键值组成的数组,map方法是一个遍历方法,返回遍历结果组成的数组.将unique对象的键名还原成对象数组
return JSON.parse(u);
})
return arr;
}
解析:可以在第二个参数上解决对象属性的顺序问题,给它加上一个数组['name','author']即可
5、实现深拷贝
function deepClone(data) {
let _data = JSON.stringify(data),
dataClone = JSON.parse(_data);
return dataClone;
};
//测试
let arr = [1,2,3],
_arr = deepClone(arr);
arr[0] = 2;
console.log(arr,_arr)//[2,2,3] [1,2,3]
6、判断数组是否包含某对象,或者判断对象是否相等
//判断数组是否包含某对象
let data = [{
name:'echo'
},{
name:'前端开发博客'
},{
name:'蔡生'
}],
val = {
name:'蔡生'
};
console.log(JSON.stringify(data).indexOf(JSON.stringify(val)) !== -1);//true
//判断两数组/对象是否相等
let a = [1,2,3],
b = [1,2,3];
console.log(JSON.stringify(a,a.sort()) === JSON.stringify(b,b.sort()));//true