1.ES6
ES6,是ECMAScript 6 的简称,是JavaScript语言的下一代标准,已于2015年6月正式发布。
1.1. let于const
之前,我们在编写js定义变量的时候,只有一个关键字 var。var有一个问题,就是定义的变量会成为全局变量。
// var变量的作用域问题检查
for(var i = 0;i<5;i++){
console.log(i);
}
console.log("循环外:"+i);
可以看出,在循环外部也可以获取到变量i的值。
let
关键字 :可以将i的作用域控制在循环内部。
//let 所声明的变量,只在let命令所在的代码块内有效.
for(let i = 0;i<5;i++){
console.log(i);
}
//index.html:21 Uncaught ReferenceError: i is not defined
//console.log("循环外:"+i);
const
关键字:声明的变量是常量,不能被修改,类似于java中的final关键字。
//const 所声明的变量是常量,不能被修改,类似于java中的final关键字
const a = 1;
console.log("a = ",a);
//给a重新赋值;Uncaught TypeError: Assignment to constant variable.
//a = 2;
console.log("a = ",a);
1.2.字符串扩展
ES6中,为字符串扩展了几个新的API
-
includes()
:返回布尔值,标识是否找到了参数字符串 -
startWith()
:返回布尔值,标识参数字符串是否在原字符串的尾部 -
endWith()
:返回布尔值,标识参数字符串是否在原字符串的尾部
let str = "hello fechin";
console.log(str,"中是否包含了fechin ==>",str.includes("fechin"));
console.log(str,"中是否包含了fuck ==>",str.includes("fuck"));
1.3.字符串模板
ES6中提供了" ` "来作为字符串模板标记
let str2 = `你好
哈哈
呵呵`;
console.log("试一试",str2);
//在``之间的部分都会被认为是字符串的值,可以任意换行;
1.4.解构表达式
ES6中允许按照一定模式从数组和对象中提取值,然后对变量进行赋值,这被称为解构。
- 数组解构
let arr = [1,2,3];
const [x,y,z] = arr; //x,y,z将与arr中的每个位置来对应
console.log(x,y,z);
//结果为[1,2,3]
const a = arr;
console.log("+++++",a);
//结果为[1,2,3]
const [b] = arr;
console.log("-----",b);
//结果为1
- 对象解构
const person = {
name : "fechin",
age : "12",
language : ["java","js","html"]
}
let {
name,age,language} = person;
console.log(name,age,language);
//如果想要用其他变量接收,那么需要额外指定别名
//{name:na}:name是person中的属性名,冒号后面的n是解构后要赋值给的变量
let {
name:na,age:ag,language:la} = person;
console.log("+-+-+-+-+-",na,ag,la);
1.5.函数优化
1.5.1.函数参数默认值
在ES6之前,我们无法给一个函数参数设置默认值,只能采用变通写法
function add(a,b){
//判断b是否为空,为空就给默认值0
if(!b){
b = 0;
}
//判断b是否为空,为空就给默认值0
// b = b || 0;
return a + b;
}
console.log(add(1));
ES6之后,可以这么写
function add(a,b = 0){
return a + b;
}
console.log(add(1));
1.5.2.箭头函数
//箭头函数
//没有参数
let sayHello = () => console.log("你好");
sayHello();
//一个参数
let print = a => console.log(a);
print("你好呀");
//多个参数
let sum = (a,b) => {
return a+b;}
let result = sum(1,2);
console.log(result);
1.5.3.对象函数的属性简写
let person = {
name : "fechin",
eat : function(food){<