ES6新增常见特性

一:声明属性let const

var let const 区别

1.var声明变量会发生变量提升,let、const不会发生变量提升
2.var允许重复声明变量,let不可以
3.const声明变量不可以被改变

二:字符串模板

用反引号创建字符串,其中可用${'变量'}

console.log(`your name is ${name}`);

三:解构赋值对数组和对象的优化

四:箭头函数

与普通函数的区别

1、书写上用=>代替了function

2、普通函数的this指向window 而ES6箭头函数里面的this指向定义时的那个对象 而不是运行时的那个对象

//普通函数
var test = function(x){
return x+2;
}
使用箭头函数:
var test = x=>x+2;

五:新增了class

ES6中添加了对类的支持,引入了class关键字

以前编写一个构造函数(类)
function Pad(color){
this.color = color;
}
现在的写法跟Java更接近了
class Iphone{
constructor(color, size){
this.color = color;
this.size = size;
}
playgame(){
//.............
}
toString(){
return `这台手机的颜色是${this.color} 屏幕大小是${this.size}`;
}
}
我们定义了一个类,名字叫Iphone
通过类生成一个实例:
var iphone = new Iphone("白色", 5);

其中constructor被称之为构造方法,在我们new 一个对象的时候,自动被调用
不过本质上,JS依然使用了原型来实现,也就是说,这不过是一个新的写法而已 跟以前的构造函数没有区别。
要注意的是,使用了class来定义类,必须先定义再使用

六:ES6中的set方法

一般用于数组去重

var arr = [1,2,3,3,4,5];
var newarr = new Array.from(set arr)
console.log(new arr)//[1,2,3,4,5]

七:promise用来解决异步问题

1、什么是promise?

异步操作的同步代码

2、promise的基本使用

通过new promise创建一个promise对象,里面有一个参数,参数是一个回调函数,回调函数中有2个参数,resolve,reject resolve()当

异步执行成功的时候调用的方法,reject()当异步失败的时候调用的方法。

除此之外promise有一个then方法,当成功的时候执行第一个回调函数,当失败的时候执行第二个回调函数。第二个回调函数也可以通过

promise对象.catch调用

3、Promise.all():当所有的异步代码都执行完毕以后才会执行.then中的操作

4、Promise.race():只要有一个promise执行完毕后就会执行.then操作

如何实现多个异步同步执行
var p1 = new Promise(function(resolve,reject){ 
  setTimeout(function(){
     console.log('1'); 
     resolve() 
  },3000) 
}) 
function p2(){
   return new Promise(function(resolve,reject){ 
    setTimeout(function(){ 
      console.log("2"); 
      resolve(); 
    },2000) 
   }) 
} 
function p3(){ 
  return new Promise(function(resolve,reject){ 
    setTimeout(function(){
       console.log("3"); 
       resolve(); 
    },1000) 
  }) 
} 
function p4(){ 
  return new Promise(function(resolve,reject){ 
     setTimeout(function(){ 
        console.log("4"); 
        resolve(); 
      },500) 
  }) 
} 
p1.then(function(){ 
  return p2() 
}) 
.then(function(){ 
  return p3(); 
}) 
.then(function(){ 
  return p4(); 
})

八:ES6新增的Set、Map方法

set:
  set是ES6提供的一种新的数据结构,类似于数组,但是成员的值是唯一的没有重复的,接受的参数是一个数组方法有:
  add():添加
  delete():删除
  size:长度
  has():查找
  clear:清除所有
map:
  map类似于对象,也是键值对的集合, 但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键方法有:
  set():设置
  get():获取
  delete():删除
  has():查找
  clear():清除所有

九:for ...of...

for of 和for in区别

for in 可以用来遍历数组,但是会有以下几个问题

  1.index索引为字符串型数字,不能直接进行几何运算

  2.遍历顺序有可能不是按照实际数组的内部顺序

  3.使用for in会遍历数组所有的可枚举属性,例如下面例子上的原型方法method和name属性都会被遍历出来
Array.prototype.method  = function(){
    console.log(this.length)
}

var myArray = [1,2,3,4,5]

myArray.name = "数组"
  for (var key in myArray) {
            console.log(key)
        }

输出结果:

如果我们不想要method和name呢,这样的话我们可以使用ES6的for of

十:symbol函数

Symbol函数会生成一个唯一的值

可以理解为Symbol类型跟字符串是接近的

但每次生成唯一的值,也就是每次都不相等,至于它等于多少,并不重要

我来评几句
登录后评论

已发表评论数()

相关站点

热门文章