2019-06-28

形參默認(rèn)值
形參的默認(rèn)值:當(dāng)不傳入?yún)?shù)的時(shí)候使用形參的默認(rèn)值(undefined)
function Point(x = 0, y = 0){
        this.x = x;
        this.y = y;
    }
    let point1 = new Point();
    console.log(point1);

Promise對(duì)象

Promise對(duì)象: 代表了未來(lái)某個(gè)將要發(fā)生的事件(通常是一個(gè)異步操作)

有了promise對(duì)象, 可以將異步操作以同步的流程表達(dá)出來(lái), 避免了層層嵌套的回調(diào)函數(shù)(俗稱'回調(diào)地獄')
ES6的Promise是一個(gè)構(gòu)造函數(shù), 用來(lái)生成promise對(duì)象的實(shí)例




使用promise基本步驟(2步):


創(chuàng)建promise對(duì)象
*調(diào)用promise的then()


promise對(duì)象的3個(gè)狀態(tài)


pending: 初始化狀態(tài)
fullfilled: 成功狀態(tài)
rejected: 失敗狀態(tài)


promise對(duì)象的3個(gè)狀態(tài)


pending: 初始化狀態(tài)
fullfilled: 成功狀態(tài)
rejected: 失敗狀態(tài)


應(yīng)用:


使用promise實(shí)現(xiàn)超時(shí)處理
使用promise封裝處理ajax請(qǐng)求
練習(xí)網(wǎng)頁(yè)新聞評(píng)論

// 定義獲取新聞的功能函數(shù)
    function getNews(url){
        let promise = new Promise((resolve, reject) => {
            // 狀態(tài):初始化
            // 執(zhí)行異步任務(wù)
            // 創(chuàng)建xmlHttp實(shí)例對(duì)象
            let xmlHttp = new XMLHttpRequest();
            console.log(xmlHttp.readyState);
            //綁定readyState監(jiān)聽(tīng)
            xmlHttp.onreadystatechange = function(){
                if(xmlHttp.readyState === 4){
                    if(xmlHttp.status == 200){//請(qǐng)求成功
                        // console.log(xmlHttp.responseText);
                        //修改狀態(tài)
                        resolve(xmlHttp.responseText);//修改promise的狀態(tài)為成功的狀態(tài)
                    }else{//請(qǐng)求失敗
                        reject('暫時(shí)沒(méi)有新聞內(nèi)容');
                    }
                }
            };
            // open設(shè)置請(qǐng)求的方式以及url
            xmlHttp.open('GET', url);
            // 發(fā)送
            xmlHttp.send();
        })
        return promise;
    }
    getNews('http://localhost:30001/news?id=2')
    //成功和失敗
        .then((data) => {
            console.log(data);
            // console.log(typeof data);
            // 準(zhǔn)備獲取評(píng)論內(nèi)容的url
            let commentsUrl = JSON.parse(data).commentsUrl;
            let url = 'http://localhost:3000' + commentsUrl;
            // 發(fā)送請(qǐng)求獲取評(píng)論內(nèi)容
            return getNews(url);
        }, (error) => {
            console.log(error);
        })
        .then((data) => {
            console.log(data);
        }, () => {
        });

async函數(shù)
async函數(shù)(源自ES2017)
概念: 真正意義上去解決異步回調(diào)的問(wèn)題,同步流程表達(dá)異步操作
本質(zhì): Generator的語(yǔ)法糖
語(yǔ)法:
async function foo(){
await 異步操作;
await 異步操作;
}
特點(diǎn):
1、不需要像Generator去調(diào)用next方法,遇到await等待,當(dāng)前的異步操作完成就往下執(zhí)行
2、返回的總是Promise對(duì)象,可以用then方法進(jìn)行下一步操作
3、async取代Generator函數(shù)的星號(hào)*,await取代Generator的yield
4、語(yǔ)意上更為明確,使用簡(jiǎn)單,經(jīng)臨床驗(yàn)證,暫時(shí)沒(méi)有任何副作用
class

通過(guò)class定義類/實(shí)現(xiàn)類的繼承
在類中通過(guò)constructor定義構(gòu)造方法
通過(guò)new來(lái)創(chuàng)建類的實(shí)例
通過(guò)extends來(lái)實(shí)現(xiàn)類的繼承
通過(guò)super調(diào)用父類的構(gòu)造方法
重寫從父類中繼承的一般方法

//定義一個(gè)人物的類
    class Person{
        // 類的構(gòu)造方法
        constructor(name, age){
            this.name = name;
            this.age = age;
        }
        // 類的一般方法
        showName(){
            console.log('調(diào)用父類的方法');
            console.log(this.name, this.age);
        }
    }
    let person = new Person('kobe', 40);
    console.log(person);
    // person.showName();
    // 子類
    class StarPerson extends Person{
        constructor(name, age, salary){
            super(name, age);
            this.salary = salary;
        }
        // class StarPerson extends Person{
        //  constructor(){
        //      super()//調(diào)用父類的構(gòu)造方法            -
        
        //  }
        // }
        // 父類的方法重寫
        showName(){
            console.log('調(diào)用子類的方法');
            console.log(this.name, this.age, this.salary);
        }
    }
    let sp = new StarPerson('wade', 36, 152450000);
    console.log(sp);
    sp.showName();

字符串?dāng)U展

includes(str) : 判斷是否包含指定的字符串
startsWith(str) : 判斷是否以指定字符串開(kāi)頭
endsWith(str) : 判斷是否以指定字符串結(jié)尾
repeat(count) : 重復(fù)指定次數(shù)

let str = 'asdfohsvckxnlck';
    console.log(str.includes('t'));
    console.log(str.includes('a'));
    console.log(str.startsWith('a'));
    console.log(str.endsWith('k'));
    console.log(str.repeat(5));

數(shù)值擴(kuò)展
二進(jìn)制與八進(jìn)制數(shù)值表示法: 二進(jìn)制用0b, 八進(jìn)制用0o

Number.isFinite(i) : 判斷是否是有限大的數(shù)
Number.isNaN(i) : 判斷是否是NaN
Number.isInteger(i) : 判斷是否是整數(shù)
Number.parseInt(str) : 將字符串轉(zhuǎn)換為對(duì)應(yīng)的數(shù)值
Math.trunc(i) : 直接去除小數(shù)部分

console.log(0b1010);//10
    console.log(0o56);//46
    console.log(Number.isFinite(123));//true
    console.log(Number.isFinite(Infinity));//flase
    console.log(Number.isNaN(NaN));//true
    console.log(Number.isInteger(123));//true
    console.log(Number.isInteger(123.456));//false
    console.log(Number.isInteger(123.0));//true
    console.log(Number.parseInt('123abc456'));//123
    console.log(Number.parseInt('a123abc456'));//NaN
    console.log(Math.trunc('123.123'));//123

數(shù)組擴(kuò)展
. Array.from(v) : 將偽數(shù)組對(duì)象或可遍歷對(duì)象轉(zhuǎn)換為真數(shù)組

Array.of(v1, v2, v3) : 將一系列值轉(zhuǎn)換成數(shù)組
find(function(value, index, arr){return true}) : 找出第一個(gè)滿足條件返回true的元素
findIndex(function(value, index, arr){return true}) : 找出第一個(gè)滿足條件返回true的元素下標(biāo)

let btns = document.getElementsByTagName('button');
    Array.from(btns).forEach(function(item, index){
        console.log(item);
    })
    let arr = Array.of(1, 4, 'abc', true);
    console.log(arr);
    let arr2 = [2,3,4,2,5,7,3,6,5];
    let result = arr2.find(function(item, index){
        return item > 4;
    });
    console.log(result);//5
    result = arr2.findIndex(function(item, index){
        return item > 4;
    });
    console.log(result);//4

對(duì)象擴(kuò)展

Object.is(v1, v2)


判斷2個(gè)數(shù)據(jù)是否完全相等,以字符串形式來(lái)判斷


Object.assign(target, source1, source2..)


將源對(duì)象的屬性復(fù)制到目標(biāo)對(duì)象上


直接操作 proto 屬性  隱式原型
let obj2 = {};
obj2.proto = obj1;

console.log(0 == -0);//true
    console.log(NaN == NaN);//false
    console.log(Object.is(0, -0));//false
    console.log(Object.is(NaN, NaN));//true
    let obj = {};
    let obj1 = {username:'iverson', age:43};
    let obj2 = {sex: '男'};
    Object.assign(obj, obj1, obj2);
    console.log(obj);
    let obj3 = {};
    let obj4 = {money: 5000000};
    obj3.__proto__ = obj4;//相當(dāng)與obj4是obj3的父類 所以obj3可以使用obj4的東西
    console.log(obj3);
    console.log(obj3.money);

ES7


指數(shù)運(yùn)算符(冪): **
Array.prototype.includes(value) : 判斷數(shù)組中是否包含指定value

console.log (2 ** 3);//8

let arr = [1,4,5,6,"abc"];
console.log(arr.includes("a"));//false
console.log(arr.includes("abc"));//true
console.log(arr.includes(4));//true

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容