1. let菇存、const
1.1 var存在的問題
- var有作用域問題（會(huì)污染全局作用域）
- var可已重復(fù)聲明
- var會(huì)變量提升預(yù)解釋
- var不能定義常量
1.2 let盾计、const特性
- let句各、const不可以重復(fù)聲明
- let寞缝、const不會(huì)聲明到全局作用域上
- let符欠、const不會(huì)預(yù)解釋變量
- const做常量聲明（一般常量名用大寫）
1.3 試一試
//1. 作用域
//var
var a = 5;
console.log(window.a); //5
//let、const
let a = 5;
console.log(window.a); //undefined
//有一個(gè)問題衙荐，let定義的a聲明到哪里了呢捞挥？歡迎解釋（：
//2. 重復(fù)聲明
//var
var a = 5;
var a = 6;
//let、const
let a = 5;
let a = 6; //Identifier 'a' has already been declared 不能重復(fù)聲明
//3. 預(yù)解釋
//var
console.log(a); //undefined 相當(dāng)于 var a;
var a = 5;
//let const
console.log(a)//Uncaught ReferenceError: a is not defined 語法錯(cuò)誤忧吟，沒有預(yù)解釋
let a = 5;
//4. 常量
//var
var a = 5;
a = 6;
//const
const a = 5;
a = 6;//Uncaught TypeError: Assignment to constant variable. 語法錯(cuò)誤
2.解構(gòu)
解構(gòu)是es6新特性砌函，可以對(duì)數(shù)組對(duì)象內(nèi)容直接解析。
//1.數(shù)組解構(gòu)
let [a1,a2,a3] = [1,2,3]; //a1 = 1; a2 = 2; a3 = 3;
//2.對(duì)象解構(gòu)
let {name,age} = {name:'meteor',age:8}; //name = 'meteor',age = 8;
//let {name:n} = {name:'meteor',age:8};//n = 'meteor' 可以用“：”的形式修改變量名
//3.復(fù)雜解構(gòu)
let [{age}] = [{age:8,name:'xx'},'深圳',[1,2,3]]; //age = 8 注意對(duì)象解構(gòu)
//4.默認(rèn)賦值
let {age=5} = {age:8,name:'xx'}; //age=8 如果沒有age字段 age=5
//常用函數(shù)參數(shù)給默認(rèn)值
//以前
function(){var a = a || 5}
//現(xiàn)在
function(a=5){}
3.字符串
es6中加入了“`”反引號(hào)溜族，反引號(hào)中${}處理模版字符串讹俊。
3.1 反引號(hào)
- 更人性的字符串拼接
let name = 'xx';
let age = 9;
let str = `${name}${age}歲了`;
console.log(str); //xx今年歲了
- 使用正則+eval的簡(jiǎn)單模擬
let name = 'xx';
let age = 9;
let str = "${name}${age}歲了";
str = str.replace(/\$\{([^}]+)\}/g, function ($1) {
return eval(arguments[1]);
})
console.log(str); //xx今年歲了
- 帶標(biāo)簽的模版字符
//反引號(hào)前使用方法，方法按模版變量把字符串分成兩個(gè)數(shù)組
//第一個(gè)為固定值組成的數(shù)組
//第二個(gè)值為替換變量組成的數(shù)組
let name = 'xx';
let age = 9;
function tag(strArr, ...args) {
var str = '';
for (let i = 0; i < args.length; i++) {
str += strArr[i] + args[i]
}
console.log(strArr,args);
//[ '', '今年', '歲了' ] [ 'xx', 9 ]
//
str += strArr[strArr.length - 1];
return str;
}
let str = tag`${name}今年${age}歲了`;
console.log(str);
3.2 incluedes 方法
//判斷字符串中是否包含某個(gè)字符串
let str = 'woaini';
str.includes('ai'); //true
3.3 endsWith煌抒、startsWith 方法
//判斷字符串是否以某一個(gè)字符串開始或結(jié)束
var a = '1AB2345CD';
console.log(a.startsWith('1A')); //true
a.endsWith('cD') //false
4. 函數(shù)
4.1 函數(shù)參數(shù)可賦值仍劈，可解構(gòu)
function({a=5}){}
4.2 箭頭函數(shù)
- 如果參數(shù)只有一個(gè)，可以省略小括號(hào)
- 如果不寫return寡壮，可以不寫大括號(hào)
- 沒有arguments變量
- 不改變this指向
//求和
let sum = (a,b)=>a+b;
5. 數(shù)組
5.1 數(shù)組新方法
- Array.from(); //將類數(shù)組轉(zhuǎn)化成數(shù)組
- Array.of(); //創(chuàng)建數(shù)組
- Array.fill();//填充數(shù)組
- Array.reduce();//傳入回調(diào)適合處理 臨近數(shù)組元素
- Array.filter();//數(shù)組過濾
- Array.find();//查找返回值
- Array.includes();//判斷數(shù)組是否有某值
5.2 Array.from()
//Array.from();
let arr = Array.from({'0':1,'1':2,length:2});
console.log(arr);//[1,2]
5.3 Array.of()
Array.of(2,3); //[2,3]
5.4 Array.reduce()
[1, 2, 3, 4, 5].reduce((prev, next, index, current) => {
//prev 如果reduce傳入第二個(gè)參數(shù)贩疙，prev為第二個(gè)參數(shù)；否則prev為數(shù)組第一個(gè)元素 往后累加
//next 如果reduce傳入第二個(gè)參數(shù)况既，next為第數(shù)組第一個(gè)元素这溅；否則next為數(shù)組第二個(gè)元素 依次累加
//index 函數(shù)第幾次執(zhí)行1開始
//current當(dāng)前數(shù)組
return prev + next;
})
//reduce方法簡(jiǎn)單實(shí)現(xiàn)
Array.prototype.myReduce = function (cb, pre) {
let prev = pre || this[0];
for (var i = pre ? 0 : 1; i < this.length; i++) {
prev = cb(prev, this[i], i, this);
}
return prev;
}
5.3 Array.filter();
let result = [1,2,3,4,5].filter(function(item){
return item>3;
})
console.log(result);//[4,5]
//filter簡(jiǎn)單實(shí)現(xiàn)
Array.prototype.myFilter = function(cb){
var arr = [];
for(var i=0; i<this.length; i++){
var item = this[i];
if( cb(item) ) arr.push(item);
}
return arr;
}
5.4 Array.find();
let result = [1,1,1,2,3].find(function(item){
return item == 2;
})
console.log(result);//2
6 對(duì)象
6.1 如果key和value相等則可以簡(jiǎn)寫
let name = 'xx';
let obj = {name};
6.2 解構(gòu)
7 Class 類
- Class 定義類
- extends 實(shí)現(xiàn)繼承
- 支持靜態(tài)方法
- constructor構(gòu)造方法
class Parent{
constructor(name){
this.name = name;
}
getName(){
return this.name;
}
static fn(){
return 9;
}
}
class Child extends Parent{
constructor(name,age){
super(name);//子類有構(gòu)造函數(shù)必須有super
this.age = age;
}
}
let child = new Child('xingxing',9);
console.log(child.getName());//xingxing
console.log(child.name);//xingxing
console.log( Child.fn() );//9
