ES6新语法特性

2025-12-22 07:41:29

1、 let 、const 、var声明变量区别

      let: 避免了变量提升  只在块级作用域内起作用

      var 全部声明

         contst 只在块级作用域内作用, 不存在变量提升,必须先定义后使用, 不可重复声明, 声明后必须赋值  注:不可以重新赋值,但是可以更改里面的属性值

ES6新语法特性

ES6新语法特性

2、for of 循环

    格式:for (let item of Arr)

    优点: ①相比for(let i=0;i<Arr.length;i++){}代码更简洁

        ②可以用break来终止整个循环,或者continute来跳出当前循环,继续后面的循环

         ③获取到数组的索引for(let indexof arr.keys())  

         ④可以循环任何可迭代(也就是遵守可迭代协议)类型的数据

        ⑤for...of 循环将只循环访问对象中的值

                缺点:不可以循环对象

ES6新语法特性

ES6新语法特性

ES6新语法特性

ES6新语法特性

ES6新语法特性

ES6新语法特性

3、模板拼接:

ES6中允许使用反引号 ` 来创建字符串,此种方法创建的字符串里面可以包含由美元符号加花括号包裹的变量${vraible}。看一下实例就会明白了:

 方式:` ${}`  事例:`<li>${test}</li>`

ES6新语法特性

ES6新语法特性

4、解构

   在ES6中,可以使用解构从数组和对象提取值并赋值给独特的变量

   解构数组的值:

      const point = [10, 25, -34];

      const [x, y, z] = point;

      console.log(x, y, z);

      Prints: 10 25 -34

    []表示被解构的数组, x,y,z表示要将数组中的值存储在其中的变量, 在解构数组是, 还可以忽略值, 例如const[x,,z]=point,忽略y坐标.

   解构对象中的值:

      const gemstone = {

         type: 'quartz',

         color: 'rose',

         karat: 21.29

      };

      const {type, color, karat} = gemstone;

      console.log(type, color, karat);

    花括号 { } 表示被解构的对象,type、color 和 karat 表示要将对象中的属性存储到其中的变量

ES6新语法特性

5、 展开运算符(用三个连续的点 (...) 表示)是 ES6 中的新概念,使你能够将字面量

1:连接两个数组 

用途2:将变量赋数组值

用途3:可变参数函数    

ES6新语法特性

ES6新语法特性

6、箭头函数    

存储在变量中,

当做参数传递给函数,

存储在对象的属性中。

            const sayHi = () => console.log('Hello Udacity Student!')

  this指向:对于箭头函数,this的值基于函数周围的上下文, 换句话说,this的值和函数外面的this的值是一样的

           函数内的 this 的值是全局对象,不是 dessert 对象

     1、解决此问题的方式之一是使用闭包(closure):

  2、使用箭头函数

ES6新语法特性

ES6新语法特性

7、Spread / Rest 操作符

Spread / Rest 操作符指的是 ...,具体是 Spread 还是 Rest 需要看上下文语境。

当被用于迭代器中时,它是一个 Spread 操作符:

当被用于函数传参时,是一个 Rest 操作符:当被用于函数传参时,是一个 Rest 操作符:

ES6新语法特性

ES6新语法特性

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢