【Java前端技术栈】ES6-ECMAScript6.0

【Java前端技术栈】ES6-ECMAScript6.0_第1张图片

【Java前端技术栈】ES6-ECMAScript6.0_第2张图片

【Java前端技术栈】ES6-ECMAScript6.0_第3张图片

一、ES6基本介绍

1. ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准, 2015 年 6 月发布。

2. ES6 设计目标:达到 JavaScript 语言可以用来编写复杂的大型程序,成为企业级开发语 言

3. ECMAScript 和 JavaScript 的关系:ECMAScript是JavaScript的规范/规则,JavaScript 是ECMAScript的一种实现

二、let声明变量




    
    let基本使用
    




注意事项和使用细节

1. let 声明的变量有严格局部作用域

2. let 只能声明一次, var 可以声明多次

3. let 不存在变量提升, var 存在变量提升 (在某个获取语句之后的定义的变量)




    
    let 的使用细节
    




三、const声明常量/只读变量

类似java之中的final




    
    const 常量/只读变量的使用
    




不过不定义会报错 而且定义过之后不能修改这个值

四、解构赋值

1. 解构赋值是对赋值运算符的扩展

2. 是一种针对数组或者对象进行模式匹配,然后对其中的变量进行赋值

3. 主要有两种形式: 数组解构和对象解

1.数组解构赋值

自动模式匹配




    
    数组的解构赋值
    




2.对象解构




    
    对象解构
    




五、模版字符串

1.模板字符串使用反引号 ` 将字符串包裹

2.可作为普通字符串

3.可用来定义多行字符串,即可以将换行字符串原生输出

4.字符串插入变量和表达式, 使用 ${}

5.字符串中调用函数




    
    模板字符串的使用
    




六、对象相关特性

1.声明对象简写




    
    声明对象的简写方式
    




2.对象方法简写




    
    对象方法的简写形式
    





3.对象运算符的拓展




    
    对象运算符的扩展
    




七、箭头函数

1.基本介绍

1. 箭头函数提供更加简洁的函数书写方式。

2. 基本语法是:(参数列表) => { 函数体 }

3. 箭头函数没有参数或有多个参数,要用 () 括起来,箭头函数只有一个参数, 可以省略()

4. 箭头函数函数体有多行语句,用 {} 包裹起来,表示代码块

5. 函数体只有一行语句,并且需要返回结果时,可以省略 {} , 结果会自动返回

6. 箭头函数多用于匿名函数的定义

2.箭头函数的基本使用

单个形式参数




    
    箭头函数的使用
    




多个形式参数




    
    箭头函数使用案例2
    




箭头函数加对象解构       




    
    箭头函数+对象解构
    




 注意事项

1 箭头函数+对象解构, 注意参数是({属性名})

2 ({属性名}) 是由{} 包括的,属性名需要和对象属性名一致,使用到了对象解构

你可能感兴趣的:(es6,前端,ecmascript)