开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第18天，点击查看活动详情

5、对象的复制

indexOf()

• 获取元素在数组中第一次出现的索引
• 参数：
  1. 要查询的元素
  2. 查询的起始位置

lastIndexOf()

• 获取元素在数组中最后一次出现的位置
• 返回值：

找到了则返回元素的索引， 没有找到返回-1

join()

• 将一个数组中的元素连接为一个字符串
• ["孙悟空", "猪八戒", "沙和尚", "唐僧", "沙和尚"] -> "孙悟空,猪八戒,沙和尚,唐僧,沙和尚"
• 参数： 指定一个字符串作为连接符

slice()

• 用来截取数组（非破坏性方法）    
• 参数：
  1. 截取的起始位置（包括该位置）
  2. 截取的结束位置（不包括该位置）  
• 第二个参数可以省略不写，如果省略则会一直截取到最后
• 索引可以是负值

如果将两个参数全都省略，则可以对数组进行浅拷贝（浅复制）

    <script>
        let arr = ['孙悟空','猪八戒','沙和尚','唐僧','沙和尚']
        
        let result = arr.indexOf('沙和尚',3)//4,起始位置从位置3开始的（下标为2)，所以最后找到的是下标为4的
        result = arr.lastIndexOf("沙和尚",3)//2,倒着找的，最后一次出现的位置为下标为2的地方
        result = arr.indexOf("白骨精")
​
        result = arr.join()//转换成字符串
        result = arr.join("@_@")
        result = arr.join("")//完全连接在一起了，没有逗号啥的
​
        arr = ['孙悟空','猪八戒','沙和尚','唐僧']
        result = arr.slice(0,2)
        result = arr.slice(1,3)
        result = arr.slice(1,-1)//到倒数第一个为止，所以只能取到倒数第二个沙和尚那
        console.log(result)
    </script>

6、数组的复制

如何去复制一个对象 复制必须要产生新的对象

当调用slice时，会产生一个新的数组对象，从而完成对数组的复制

    <script>
        const arr = ["孙悟空", "猪八戒", "沙和尚"]
        // const arr2 = arr  // 不是复制
        // arr2[0] = "唐僧"
​
        const arr3 = arr.slice()
        // console.log(arr === arr2)
        // console.log(arr2)
​
        arr3[0] = "唐僧"
        console.log(arr)
        console.log(arr3)
    </script>

7、浅拷贝和深拷贝

浅拷贝（shallow copy）

• 通常对对象的拷贝都是浅拷贝
• 浅拷贝顾名思义，只对对象的浅层进行复制（只复制一层）
• 如果对象中存储的数据是原始值，那么拷贝的深浅是不重要
• 浅拷贝只会对对象本身进行复制，不会复制对象中的属性（或元素）

深拷贝（deep copy）

• 深拷贝指不仅复制对象本身，还复制对象中的属性和元素
• 因为性能问题，通常情况不太使用深拷贝

    <script>
        //创建一个数组
        const arr = [{name:'孙悟空'},{name:'猪八戒'}]
        const arr2= arr.slice()//浅拷贝
​
        const arr3 = structuredClone(arr)//专门用来深拷贝的方法
​
        console.log(arr)
        console.log(arr3)
    </script>

8、对象的复制

对象的复制

• Object.assign(目标对象, 被复制的对象)

• 将被复制对象中的属性复制到目标对象里，并将目标对象返回

• 也可以使用展开运算符对对象进行复制

... (展开运算符)

• 可以将一个数组中的元素展开到另一个数组中或者作为函数的参数传递

• 通过它也可以对数组进行浅复制

    <script>
        const arr = ['孙悟空','猪八戒','沙和尚']
        const arr2 = arr.slice()
​
        console.log(arr===arr2)//false
​
        // const arr3 = [arr[0],arr[1],arr[2]]
        const arr3 = [...arr]//效果一致
        // const arr3 = ['唐僧',...arr,'白骨精']
​
        console.log(arr)
        console.log(arr3)
    </script>

9、数组的方法

push()

• 向数组的末尾添加一个或多个元素，并返回新的长度 pop()
• 删除并返回数组的最后一个元素

unshift()

• 向数组的开头添加一个或多个元素，并返回新的长度

shift()

• 删除并返回数组的第一个元素

splice()

• 可以删除、插入、替换数组中的元素

• 参数：

  0. 删除的起始位置
  1. 删除的数量
  2. 要插入的元素

• 返回值：

  • 返回被删除的元素

reverse()

• 反转数组

    <script>
        let arr = ['孙悟空','猪八戒','沙和尚']
​
        let result = arr.push('唐僧','白骨精')
        console.log(arr)
​
        result = arr.pop()//返回被删除的元素名字
        console.log(result)
        result = arr.unshift('牛魔王')//返回长度下标
​
        arr = ['孙悟空','猪八戒','沙和尚','唐僧']
        result = arr.splice(1,3)
        // result = arr.splice(1,1,'牛魔王'`,'铁扇公主','红孩儿')
        // result = arr.splice(1,0,'牛魔王','铁扇公主','红孩儿')
        console.log(result)
​
        arr = ["a", "b", "c", "d"]
        arr.reverse()
    </script>