es6简单介绍

1、ECMAScript 6 简介

2、let和const命令

3、变量的解构赋值

4、字符串的扩展之模板字符串

5、正则的扩展

6、数值的扩展

7、函数的扩展

8、数组的扩展

9、对象的扩展

10、类

---

 

1、ECMAScript 6 简介

ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。

ECMA：国际标准组织

2、let,var和const命令

const：是用来定义一个常量的

  const a ='hello'  //const就是定义一个常量
                    //常量是不能修改的

let：是用来定义一个块级作用域的变量

let和val都是用来声明变量的，但是二者又有不同

let 先声明后使用，不存在变量提升
let 不能重复定义,但是可以修改
var 既可以先声明后使用，也可以先使用后声明，这样不会报错，会打印undified,而let必须是先声明后使用，如果没有声明就会报错

 1 
 2 
 3 
 4     
 5     
 6     
 7     
 8 
 9 
10     
39 
40 

const-let示例

3、变量的解构赋值

 数组解构赋值，就是把数组元素的值按照顺序依次赋值

 解构变量就是赋值，用更少的代码来解决更多的事情

 1 
 2 
 3 
 4     
 5     
 6     
 7     
 8 
 9 
10 
46 
47 

变量的解构赋值

4、字符串的扩展之模板字符串

通过反引号来使用，字符串当中可以使用变量。可以当做普通字符串来处理，可以使用多行字符串

传统的 JavaScript 语言，输出模板通常是这样写的。

上面这种写法相当繁琐不方便，ES6 引入了模板字符串解决这个问题。

模板字符串（template string）是增强版的字符串，用反引号（`）标识。它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。

 1 
 2 
 3 
 4     
 5     
 6     
 7     
 8 
 9 
10 
11     

12         
asdasd
13         

14     
15 
16 
29 
30 

反引号示例

5、正则的扩展

6、数值的扩展

7、函数的扩展

可以给函数设置默认参数

剩余参数：function func(a,...b){}
func(11,22,33)
则：b=[22,33]

 1 
 2 
 3 
 4     
 5     
 6     
 7     
 8     
35 
36 
37 
38 
39 

函数的扩展

8、数组的扩展

 1、判断数组当中是否存在某个数值
      console.log(arr.indexOf(1000))
      console.log(arr.includes(201))
   2、对数组的遍历
      forEach()：范围比map广，他能做的事情map不一定能做
      map()：map能做的事情forEach一定能做

      arr.forEach(function (value,index) {
            console.log(value);
      })

      //也可以不用map,在forEach里面就能做操作，为了简单用一个map也可以解决，具体见示例
      var arr2 = arr.map(function (value,index) {
            return value+1
      })
    3)对数组的过滤
     var arr4 = arr.filter(function (value,index) {
                return value > 50
            })
            console.log(arr4);

 1 
 2 
 3 
 4     
 5     
 6     
 7     
 8     
62 
63 
64 
65 
66 

对数组的扩展

9、对象的扩展

对象当中的属性可以简写，对象当中的方法也可以简写

 1 
 2 
 3 
 4     
 5     
 6     
 7     
 8     
35 
36 
37 
38 
39 
40 

对象的扩展

10、类

 1 
 2 "en">
 3 
 4     "UTF-8">
 5     "X-UA-Compatible" content="IE=edge">
 6     "viewport" content="width=device-width">
 7     
 8     
33 
34 
35 
36 
37 

类的示例

 

11、维护学生信息的一个小示例

    
    
    
    
    
    



    

    

    


    for="(item,index) in arr">
            

        
{{item.username}}
            
{{item.age}}
            

            

        
    
    

        

        

        

            
            
        

    

 

转载于:https://www.cnblogs.com/haiyan123/p/8361470.html