目錄

• 聲明變量let和const
• 變量的解構賦值：數(shù)組畦幢，對象，字符串
• 字符串相關擴展：includes,startWiths,endWith,模板字符串
• 函數(shù)擴展：參數(shù)默認值确沸，參數(shù)解構賦值，rest參數(shù)，...擴展運算符蔬浙，合并數(shù)組
• 箭頭函數(shù)：不可以new
• 類與繼承：靜態(tài)方法铝耻，super

聲明變量let和const

• let
  聲明的變量不存在預解析(在塊級作用域內(nèi)部誊爹，變量只能先聲明再使用)
  聲明的變量不允許重復（在同一個作用域內(nèi)）

• const 用來聲明常量
  聲明的常量不允許重新賦值
  聲明的常量必須初始化

• ES6引入了塊級作用域
  塊內(nèi)部定義的變量，在外部是不可以訪問的

{
    // 這里是塊級作用域
    let flag = 111;
    console.log(flag);
}
for (let i = 0; i < 3; i++) {
    // for循環(huán)括號中聲明的變量只能在循環(huán)體中使用
    console.log(i);
}
console.log(i);

變量的解構賦值

• 數(shù)組的解構賦值

let [a,b,c] = [1,2,3];
let [a,b,c] = [,123,];
let [a=111,b,c] = [,123,];
console.log(a,b,c);

• 對象的解構賦值

let {foo,bar} = {foo : 'hello',bar : 'hi'};
let {foo,bar} = {bar : 'hi',foo : 'hello'};

- 對象屬性別名(如果有了別名瓢捉，那么原來的名字就無效了)
let {foo:abc,bar} = {bar : 'hi',foo : 'nihao'};
console.log(foo,bar);
- 對象的解構賦值指定默認值
let {foo:abc='hello',bar} = {bar : 'hi'};
console.log(abc,bar);

let {cos,sin,random} = Math;

• 字符串的解構賦值

let [a,b,c,d,e,length] = "hello";
console.log(a,b,c,d,e);
console.log(length);

console.log("hello".length);

let {length} = "hi";
console.log(length);

字符串相關擴展

• includes() 判斷字符串中是否包含指定的字串（有的話返回true频丘，否則返回false）
  參數(shù)一：匹配的字串；參數(shù)二：從第幾個開始匹配
• startsWith() 判斷字符串是否以特定的字串開始
• endsWith() 判斷字符串是否以特定的字串結束
• 模板字符串

console.log('hello world'.includes('world',7));
let url = 'admin/index.php';
console.log(url.startsWith('aadmin'));
console.log(url.endsWith('phph'));

let obj = {
    username : 'lisi',
    age : '12',
    gender : 'male'
}
let tag = '<div><span>'+obj.username+'</span><span>'+obj.age+'</span><span>'+obj.gender+'</span></div>';
console.log(tag);
- 反引號表示模板泡态，模板中的內(nèi)容可以有格式椎镣，通過${}方式填充數(shù)據(jù)
let fn = function(info){
    return info;
}
- 模板字符串
let tpl = `
    <div>
        <span>${obj.username}</span>
        <span>${obj.age}</span>
        <span>${obj.gender}</span>
        <span>${1+1}</span>
        <span>${fn('nihao')}</span>
    </div>
`;
console.log(tpl);

函數(shù)擴展

• 參數(shù)默認值
• 參數(shù)解構賦值
• rest參數(shù)
• ...擴展運算符
• 合并數(shù)組

- 參數(shù)默認值
function foo(param){
     let p = param || 'hello';
     console.log(p);
}
foo('hi');
function foo(param = 'nihao'){
    console.log(param);
}
foo('hello kitty');
----------------------------------
- 參數(shù)解構賦值
 function foo({uname='lisi',age=13}={}){
     console.log(uname,age);
}
foo({uname:'zhangsan',age:15});
--------------------------------------
- rest參數(shù)（剩余參數(shù)）
function foo(a,b,...param){
     console.log(a);
     console.log(b);
     console.log(param);
}
foo(1,2,3,4,5);
--------------------------------------
- 擴展運算符 ...
function foo(a,b,c,d,e,f,g){
    console.log(a + b + c + d + e + f + g);
}
- foo(1,2,3,4,5);
let arr = [1,2,3,4,5,6,7];
- foo.apply(null,arr);
foo(...arr);
--------------------------------------
- 合并數(shù)組
let arr1 = [1,2,3];
let arr2 = [4,5,6];
let arr3 = [...arr1,...arr2];
console.log(arr3);

箭頭函數(shù)

• 箭頭函數(shù)的注意事項
  1、箭頭函數(shù)中this取決于函數(shù)的定義兽赁，而不是調(diào)用
  2状答、箭頭函數(shù)不可以new
  3、箭頭函數(shù)不可以使用arguments獲取參數(shù)列表刀崖，可以使用rest參數(shù)代替

function foo(){
     console.log('hello');
}
 foo();

let foo = () => console.log('hello');
foo();
--------------------------------------
- 多個參數(shù)必須用小括號包住
let foo = (a,b) => {let c = 1; console.log(a + b + c);}
foo(1,2);
--------------------------------------
let arr = [123,456,789];
arr.forEach(function(element,index){
     console.log(element,index);
 });
arr.forEach((element,index)=>{
     console.log(element,index);
});
--------------------------------------
- 箭頭函數(shù)的注意事項：
- 1惊科、箭頭函數(shù)中this取決于函數(shù)的定義，而不是調(diào)用
function foo(){
     // 使用call調(diào)用foo時亮钦，這里的this其實就是call的第一個參數(shù)
     // console.log(this);
     setTimeout(()=>{
         console.log(this.num);
     },100);
}
- foo.call({num:1});
----------------------------------
2馆截、箭頭函數(shù)不可以new
let foo = () => { this.num = 123;};
new foo();
------------------------------------
3、箭頭函數(shù)不可以使用arguments獲取參數(shù)列表，可以使用rest參數(shù)代替
let foo = (a,b) => {
     // console.log(a,b);
     console.log(arguments);//這種方式獲取不到實參列表
}
foo(123,456);
let foo = (...param) => {
    console.log(param);
}
foo(123,456 );

類與繼承

• 靜態(tài)方法(靜態(tài)方法只能通過類名調(diào)用蜡娶，不可以使用實例對象調(diào)用)
• super用來調(diào)用父類

function Animal(name){
    this.name = name;
}
Animal.prototype.showName = function(){
    console.log(this.name);
}
var a = new Animal('Tom');
a.showName();
-------------------------
class Animal{
    // 靜態(tài)方法(靜態(tài)方法只能通過類名調(diào)用混卵，不可以使用實例對象調(diào)用)
    static showInfo(){
        console.log('hi');
    }
    // 構造函數(shù)
    constructor(name){
        this.name = name;
    }

    showName(){
        console.log(this.name);
    }
}
let a = new Animal('spike');
a.showName();
// a.showInfo();
Animal.showInfo();
------------------------------
// 類的繼承extends
class Dog extends Animal{
    constructor(name,color){
        super(name);//super用來調(diào)用父類
        this.color = color;
    }

    showColor(){
        console.log(this.color);
    }
}

let d = new Dog('jump','white');
d.showName();
d.showColor();
// d.showInfo();
Dog.showInfo();