「这是我参与11月更文挑战的第16天，活动详情查看：2021最后一次更文挑战」
es6入门语法
ECMAScript 6.0（以下简称 ES6）是 JavaScript 语言的下一代标准，已经在 2015 年 6 月正式发布了。它的目标，是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。
let（声明变量）
1. 作用域：let中定义的变量只在let定义的代码块内有效
举个栗子：
- js定义: var a = 1;
- es6写法定义变量，使用关键字let，定义let a = 20;
{
var a = 10;
let b = 20;
}
console.log(a);
console.log(b);
看效果：
显示Uncaught ReferenceError: b is not defined，说明找不到b。
2. 在let定义变量时，相同的变量只能被定义一次
举个栗子：
let b = 10;
let b = 20;
console.log(b);
看效果：
显示Uncaught SyntaxError: Identifier 'b' has already been declared，说明b出现重复声明的现象。
const（声明常量）
1. 使用const定义的常量一旦被定义就不能再改变。
举个栗子：
const A="lmr";
A="zxy";
console.log(A);
看效果：
显示Uncaught TypeError: Assignment to constant variable，说明常量被重复赋值
2. 使用const定义常量时必须进行初始化
const A;
console.log(A);
看效果：
显示Uncaught SyntaxError: Missing initializer in const declaration，说明const定义的常量未初始化。
解构模板
数组解构
- 传统写法
let a=1,b=2,c=3;
console.log(a,b,c);
- es6写法
let [x,y,z] = [4,5,6];
console.log(x,y,z);
看效果：
对象解构
举个栗子：
//定义对象
let user={"name":"amr","age":20};
- 传统中获取对象值
let name1=user.name;
let age1=user.age;
console.log(name1+"=="+age1);
- es6中获取对象值
let {name,age}=user;
console.log(name+"**"+age);
看效果：
- 注意：解构的变量必须是user中存在的属性，否则获取不到值（不会报错）。
模板字符串
1. 使用`（反引号）符号可以实现自动换行
举个栗子：
let str=`hello,
amr`;
console.log(str);
看效果：
2. 在`（反引号）符号里面使用表达式可以获取变量值
举个栗子：
let name="amr";
let age=20;
let str2=`hello,${name},age is ${age+1}`;
console.log(str2);
看效果：
3. 在`（反引号）符号中可以直接调用方法
举个栗子：
function f1(){
return "amr";
}
let str3=`hello,${f1()}`;
console.log(str3);
看效果：
声明对象
举个栗子：
const name="amr";
const age=20;
- 传统方式定义变量
const p1={name:name,age:age};
console.log("传统写法："+p1.name+":"+p1.age);
- es6定义变量
const p2={name,age};
console.log("es6写法："+p2.name+":"+p2.age);
看效果：
定义方法简写方式
- 传统方式定义的方法
const person={
sayHi:function(){
return console.log("Hi,mr!");
}
}
person.sayHi();
- es6方式定义的方法
const person2={
sayHi(){
return console.log("Hi,mr2!");
}
};
person2.sayHi();
看效果：
对象拓展运算符
- 对象复制 举个栗子：
let person1={"name":"amr","age":20};
let person2={...person1};
console.log(person2.name+":"+person2.age);
- 合并对象
let person3={"name":"amr2"};
let person4={"age":21};
let person5={...person3,...person4};
console.log(person5.name+":"+person5.age);
看效果：
箭头函数
简单表达：var 函数名 = 参数 => 返回值
- 传统方式创建方法
var f3 = function(a,b){
return a+b;
};
console.log("传统方式:"+f3(2,3));
- 使用es6箭头函数
var f4 = (a,b) => a+b;
console.log("es6箭头函数"+f4(3,4));
看效果：
本文至此结束！希望能帮到你...
