浅学 ES6展开运算符的使用

最新推荐文章于 2024-08-15 16:38:30 发布

码农小zhi先森

最新推荐文章于 2024-08-15 16:38:30 发布

阅读量121

点赞数 2

文章标签： javascript html5 html

本文链接：https://blog.csdn.net/fontwjz_0911/article/details/120722999

版权

参考尚硅谷的js视频对ES6的展开运算符方面进行了简单的demo尝试

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      let arr1 = [1, 3, 5, 7, 9];
      let arr2 = [2, 4, 6, 8, 10];
      let arr3 = [...arr1, ...arr2];
      //  展开一个数组
      console.log(...arr1); // 1  3  5  7  9
      //  连接数组
      console.log(arr3); // [1, 3, 5, 7, 9, 2, 4, 6, 8, 10]

      // 在函数中使用
      // 求和案例 结合数组reduce方法
      function sum(...nums) {
        return nums.reduce((preVal, curVal) => {
          return preVal + curVal;
        });
      }
      console.log(sum(1, 2, 3, 4)); //10

      // 构造字面量对象使用展开语法
      let person = { name: "tom", age: 18 };

      let person2 = { ...person };
      person.name = "小王";
      console.log(person2); //{name: 'tom', age: 18}
      console.log(person); //{name: '小王', age: 18}

      //合并的操作
      let person3 = { ...person, name: "jack", address: "北极" };
      console.log(person3); //{name: 'jack', age: 18, address: '北极'}
    </script>
  </body>
</html>

码农小zhi先森

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
浅学 ES6展开运算符的使用

参考尚硅谷的js视频对ES6的展开运算符方面进行了简单的demo尝试<script> let arr1 = [1, 3, 5, 7, 9]; let arr2 = [2, 4, 6, 8, 10]; let arr3 = [...arr1, ...arr2]; // 展开一个数组 console.log(...arr1); // 1 3 5 7 9 // 连接数组 console....
复制链接

扫一扫