ES6新特性及其用法

Posted syf976561581

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ES6新特性及其用法相关的知识,希望对你有一定的参考价值。

   Es6是什么:

     ES6是ECMAScript 6的缩写简称,是javascript的核心语法,它是ECMAScript的第6个版本.2015 年 6 月,ECMAScript 6 正式通过,成为国际标准

  1.说出至少5个ES6的新特性,并简述它们的作用。(简答题)

1、 let关键字,用于声明只在块级作用域起作用的变量。
2、 const关键字,用于声明一个常量。
3、 结构赋值,一种新的变量赋值方式。常用于交换变量值,提取函数返回值,设置默认值。
4、 Symbol数据类型,定义一个独一无二的值。
5、 Proxy代理,用于编写处理函数,来拦截目标对象的操作。
6、 for…of遍历,可遍历具有iterator 接口的数据结构。
7、 Set结构,存储不重复的成员值的集合。
8、 Map结构,键名可以是任何类型的键值对集合。
9、 Promise对象,更合理、规范地处理异步操作。
10、Class类定义类和更简便地实现类的继承。

**解构赋值:**
  1. 可以同时给多个变量赋值
  2. 不使用第三个变量的前提下也能交换两个变量的值
  3. 函数可以使用解构赋值的方式返回值同时可以给多个变量赋值
  4. 函数传参 function aa({name=“王五”,age}){} aa({age:“18”,name:“张三”}) 可以不用考虑顺序问题了
**模板字符串**
`` 可以换行定义,可以解析变量,空格回车会输出出来,变量通过{}解析,函数通过{函数名()}调用

symbol

Es6新增的数据类型
特点:
  1. 唯一的 不需要new 一般定义属性 和常量
  2. 不能使用for in
  3. 使用[]存储
  4. 取值的时候也要用[] 相同参数 Symbol() 返回的值不相等

class

  1. 使用class 定义的类 没有变量提升
  2. 使用extends 关键字继承
  3. 子类必须在constructor方法中调用super(name,age)方法用来新建父类的this对象
  4. 构造方法 constructor(){ this.name = name}

注意:

  1. 在类中声明方法的时候,千万不要给该方法加上function关键字
  2. 方法之间不要用逗号分隔,否则会报错
    案例:
    下面展示一些 内联代码片
   class aa{
          constructor(name,age){
                this.name = name
                this.age = age
                console.log(name) 
            }``
            run(){
                alert('1111')
            }
        }
}
        class bb extends aa{
            constructor(name,age){
                //super 这个函数来重新定义父类里面构造函数的执行(注意要在构造函数内使用)
                super(name,age)
            }
        }
深拷贝和浅拷贝
  1. 数组和对象直接等号赋值的通常是浅拷贝 一个发生变化,另外一个也会跟着变,他只是指向另外一个地址
  2. 深拷贝 把里面的内容一个一个的复制出来,开一个新内存放进去,内存地址不一样,互不影响

新增数组方法:

下面的arr是自己定义的数组名
var arr=[]
  1. 1.indexOf: 检测数组或字符串中是否包含某个值,如果包含返回第一次查找到那个值所对应的下标,如果查不到返回-1
  2. 遍历数组(forEach)
   arr.forEach(function(value,index,arr){
               参数1 数组里面对应的每个值
               参数2 数组里面的索引
               参数3 原数组
              })
  1. find(回调函数) 根据查找指定值,符合条件的,会返回出来这个值,返回第一值之后就会停止查找
var arr = new Array(1,2,34,454,555,'aaa');
           console.log(arr)
           console.log(arr.find(function(item){
               return item > 34
               }
               )
  1. filter(回调函数)会把所有符合条件的值放到一个新数组中返回出来
  console.log(arr.filter(item=> item>34))
  1. map(回调函数) 映射 把数组里面的每一个元素按照你传入回调函数里面的代码都执行一遍
var arr = new Array(1,2,34,454,555,'aaa');
          var newArr = arr.map(item=>item*2)
          console.log(arr)
          console.log(newArr)
  1. some(回调函数)有一个满足条件的就会返回true,都不满足会返回false,如果第一个就满足,有短路效果,就会停止循环不会在继续搜索
  var arr= [10,11,12,13]
          var a = arr.some(aa=>aa>12)
          var a = arr.some(aa=>aa>14)
          console.log(a)
  1. every(回调函数) 必须每一个元素都符合条件才会返回true,同样有短路效果
   var a = arr.every(aa=>aa>10)  //false

以上是关于ES6新特性及其用法的主要内容,如果未能解决你的问题,请参考以下文章

Es6新特性Proxy代理用法解析

Es6新特性Proxy代理用法解析

Es6新特性Proxy代理用法解析

ES6新特性:对象优化

ES6新特性:扩展运算符 三个点(...)基础学习

ES6新特性之 let const