JavaScript-内建对象-工具盒子

⭐️ 有关JavaScript的学习总结

内建对象 {#%E5%86%85%E5%BB%BA%E5%AF%B9%E8%B1%A1}

>解构赋值 {#%3E%E8%A7%A3%E6%9E%84%E8%B5%8B%E5%80%BC}

const arr = ["孙悟空", "猪八戒", "沙和尚"]

let a,
b,
c


    // a = arr[0]
    // b = arr[1]
    // c = arr[2]




;\[a, b, c\] = arr // 解构赋值


let \[d, e, f, g\] = \["唐僧", "白骨精", "蜘蛛精", "玉兔精"\] // 声明同时解构


console.log(d, e, f, g)
// ;\[d, e, f, g\] = \[1, 2, 3\]
// ;\[d, e, f = 77, g = 10\] = \[1, 2, 3\]
;\[d, e, f = 77, g = g\] = \[1, 2, 3\]


let \[n1, n2, ...n3\] = \[4, 5, 6, 7\] // 解构数组时，可以使用...来设置获取多余的元素


// console.log(n1, n2, n3)


function fn(){
return \["二郎神", "猪八戒"\]
}


let \[name1, name2\] = fn()


// 可以通过解构赋值来快速交换两个变量的值
let a1 = 10
let a2 = 20


// let temp = a1
// a1 = a2
// a2 = temp


;\[a1, a2\] = \[a2, a1\] // \[20, 10\]


const arr2 = \["孙悟空", "猪八戒"\]
// console.log(arr2)


;\[arr2\[0\], arr2\[1\]\] = \[arr2\[1\], arr2\[0\]\]
// console.log(arr2)


// console.log("a1 =", a1)
// console.log("a2 =", a2)


/\*
数组中可以存储任意类型的数据，也可以存数组,
如果一个数组中的元素还是数组，则这个数组我们就称为是二维数组
\*/


const arr3 = \[\["孙悟空", 18, "男"\], \["猪八戒" ,28, "男"\]\]


// for(let stu of arr3){
//     for(let v of stu){
//         console.log(v)
//     }
// }


let \[\[name, age, gender\], obj\] = arr3

`console.log(name, age, gender)
console.log(obj)`

>对象的解构 {#%3E%E5%AF%B9%E8%B1%A1%E7%9A%84%E8%A7%A3%E6%9E%84}

const obj = { name: "孙悟空", age: 18, gender: "男" }

// let { name, age, gender } = obj // 声明变量同时解构对象


let name, age, gender


;({ name, age, gender } = obj)


let { address } = obj // 没有的属性返回undefined


// console.log(name, age, gender)


let {name:a, age:b, gender:c, address:d="花果山"} = obj

`console.log(a, b, c, d)`

>对象的序列化 {#%3E%E5%AF%B9%E8%B1%A1%E7%9A%84%E5%BA%8F%E5%88%97%E5%8C%96}

JSON.stringify() ------ 可以将一个对象转换为 JSON 字符串 {#json.stringify()-%E2%80%94%E2%80%94-%E5%8F%AF%E4%BB%A5%E5%B0%86%E4%B8%80%E4%B8%AA%E5%AF%B9%E8%B1%A1%E8%BD%AC%E6%8D%A2%E4%B8%BA-json-%E5%AD%97%E7%AC%A6%E4%B8%B2}

JSON.parse() ------ 可以将一个 JSON 格式的字符串转换成 JS 对象 {#json.parse()-%E2%80%94%E2%80%94-%E5%8F%AF%E4%BB%A5%E5%B0%86%E4%B8%80%E4%B8%AA-json-%E6%A0%BC%E5%BC%8F%E7%9A%84%E5%AD%97%E7%AC%A6%E4%B8%B2%E8%BD%AC%E6%8D%A2%E6%88%90-js-%E5%AF%B9%E8%B1%A1}

编写 JSON 的注意事项：

JSON 字符串有两种类型

JSON 对象{}

JSON 数组[]

JSON 字符串的属性名必须用双引号引起来

JSON 中可以使用的属性值（元素）

数字（Number）

字符串（String）必须使用双引号

布尔值（Boolean）

空值（Null）

对象（Object {}）

数组（Array []）

JSON的格式和JS对象的格式基本上一致的。
注意：JSON字符串如果属性是最后一个，则不要再加,

/* 
    对象的序列化
        - JS中的对象使用时都是存在于计算机的内存中的
        - 序列化指将对象转换为一个可以存储的格式
            在JS中对象的序列化通常是将一个对象转换为字符串（JSON字符串）
        - 序列化的用途（对象转换为字符串有什么用）：
            - 对象转换为字符串后，可以将字符串在不同的语言之间进行传递
                甚至人可以直接对字符串进行读写操作，使得JS对象可以不同的语言之间传递
            - 用途：
                1. 作为数据交换的格式
                2. 用来编写配置文字
        - 如何进行序列化：
            - 在JS中有一个工具类 JSON （JavaScript Object Notation） JS对象表示法
            - JS对象序列化后会转换为一个字符串，这个字符串我们称其为JSON字符串  

        - 也可以手动的编写JSON字符串，在很多程序的配置文件就是使用JSON编写的




\*/


const obj = {
name: "孙悟空",
age: 18,
}


// 将obj转换为JSON字符串
const str = JSON.stringify(obj) //JSON.stringify() 可以将一个对象转换为JSON字符串


const obj2 = JSON.parse(str) // JSON.parse() 可以将一个JSON格式的字符串转换为JS对象


// console.log(obj)
// console.log(str) // {"name":"孙悟空","age":18}
// console.log(obj2)


const str2 = `{"name":"猪八戒","age":28}`
const str3 = "{}"
const str4 = '\["hello", true, \[\]\]'

`console.log(str2)`

>使用 JSON 进行深复制 {#%3E%E4%BD%BF%E7%94%A8-json-%E8%BF%9B%E8%A1%8C%E6%B7%B1%E5%A4%8D%E5%88%B6}

const obj = {
    name: "孙悟空",
    friend: {
        name: "猪八戒",
    },
}

// 对obj进行浅复制
const obj2 = Object.assign({}, obj)


// 对obj进行深复制
const obj3 = structuredClone(obj)


// 利用JSON来完成深复制
const str = JSON.stringify(obj)
const obj4 = JSON.parse(str)

`// const obj5 = JSON.parse(JSON.stringify(obj))`