ECMAScript6(ES6)基础语法

let声明变量

//var 声明的变量没有局部作用域，可以多次声明
//let 声明的变量，有局部作用域，只能声明一次
{
	var a = 0
	let b =1
}
console.log(a)
console.log(b) //报错
1
2
3
4
5
6
7
8

const声明常量

const PI = "3.14" //常量一旦定义不允许更改，而且必须初始化
1

解构赋值

//传统方式
let a = 1,b = 2,c = 3
console.log(a,b,c)

//ES6
let [x,y,z] = [1,2,3]
console.log(x,y,z)

//对象解构
let user = {name:'jordan',age:23}
//传统取值
let name1 = user.name
let age1 = user.age
//ES6
let{name,age} = user //结构的变量必须是user中的属性
console.log(name,age)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

模板字符串

用反引号`
除了作为普通字符串，还可以用来定义多行字符串，还可以在字符串中加入变量和表达式

let name = 'jordan'
let age = 20

let info = `My name is ${name},
	I am ${age+1}`

console.log(info)
1
2
3
4
5
6
7

声明对象简写

const name = "jordan"
const age = 20

//传统方式定义对象
const user1 = {name:name,age:age}
console.log(user1)

//es6
const user2 = {name,age}
console.log(user2)

1
2
3
4
5
6
7
8
9
10
11
12

对象拓展运算符

扩展运算符(…)，用于取出参数对象所有可遍历属性然后拷贝到当前对象

let person1 = {name:"jordan",age:23}
let someone1 = {...person1} //将person1的内容复制到someone1

console.log(someone1)

1
2
3
4
5

let age = {age:15}
leg name = {name:jordan}
let person2 = {...age,...name} //合并对象
console.log(person2)
1
2
3
4

箭头函数

参数=>函数体 多用于匿名函数的定义

//传统
var f1 = function(a){
	return a
}
console.log(f1(1));

//ES6
var f2 = a => a
console.log(f2(1));
1
2
3
4
5
6
7
8
9

模块化

①、创建一个目录文件夹moduledemo，并初始化npm init

②、创建一个src，并创建两个文件01.js，02.js

01.js 提供两个方法

export default{
	list(){
		console.log('list......')
	},
	save(){
		console.log('save......')
	}
}
1
2
3
4
5
6
7
8

02.js中进行对01.js中的方法调用

import user from './01.js'  //引入，然后取一个别名user

user.list()
user.save()
1
2
3
4

【此时程序无法运行：因为ES6的模块化无法在Node.js中执行，需要通过Babel编辑成ES6后再执行】

babel转码器

将ES6转化为ES5

①、安装babel工具

npm install -g babel-cli

查看是否安装成功 babel --version

②、在根目录下创建一个.babelrc文件，该文件用来设置转码规则和插件

{
	"presets":["es2015"],
	"plugins":[]
}
1
2
3
4

③、安装转码器

npm install -D babel-preset-es2015

④、使用命令将src目录下的js文件转化为ES5到指定目录dist中

babel src -d dist

⑤、在dist目录中执行node 02.js命令进行调用