JS知識(shí)—面試準(zhǔn)備（一）

wapeyang 發(fā)布于2019-08-23 10:39 / 2381人閱讀

摘要：使用結(jié)束后會(huì)重新壓扁自己，讓自己不是對(duì)象。作用用來(lái)判斷某個(gè)對(duì)象是否含有指定的自身屬性語(yǔ)法參數(shù)要檢測(cè)的對(duì)象要檢測(cè)的屬性名稱。但是函數(shù)作用域外部訪問(wèn)不到函數(shù)內(nèi)部的變量，對(duì)象，函數(shù)。

1.JS內(nèi)置類型

分為基本數(shù)據(jù)類型和Object.
基本數(shù)據(jù)類型有：null,undefined,string,boolean,number,symbol.

    console.log(typeof null);//object
    console.log(typeof []);//object
    console.log(typeof {});//object

如果想要區(qū)分null，數(shù)組，對(duì)象，應(yīng)該怎么辦？

       console.log(Object.prototype.toString.call(null));//[object Null]
       console.log(Object.prototype.toString.call([]));//[object Array]
       console.log(Object.prototype.toString.call({}));//[object Object]

我的簡(jiǎn)單理解：toString（數(shù)據(jù)）；作用：將數(shù)據(jù)轉(zhuǎn)化為字符串。

2.類型轉(zhuǎn)化

類型轉(zhuǎn)化：分為顯示類型轉(zhuǎn)化，和隱式類型轉(zhuǎn)化。

1.Number（數(shù)據(jù)）

如果數(shù)據(jù)內(nèi)容式純粹的數(shù)字，才可以轉(zhuǎn)化為數(shù)字，否則式NaN。

var str2="12px";//NaN
var str2="1.2";//1.2
var str2="1.2.3";//NaN
var str2=null;//0
console.log(Number(str2));

2.NaN

NaN的數(shù)據(jù)類型書(shū)Number。注意：NaN和任何東西都不相等，包括自己。

3.isNaN（數(shù)據(jù)）

會(huì)先把數(shù)據(jù)用Number轉(zhuǎn)化，轉(zhuǎn)化完了之后在判斷是不是NaN，如果是NaN則返回為true。否則返回為fasle。

console.log(isNaN(1));//false
console.log(isNaN("123"));//false
console.log(isNaN("abc"));//true

4.parseInt(數(shù)據(jù))和parseFloat(數(shù)據(jù))

parseInt(數(shù)據(jù))：把數(shù)據(jù)變成整數(shù)，舍去小數(shù)點(diǎn)，取整數(shù)。
parseFloat(數(shù)據(jù))：把數(shù)據(jù)轉(zhuǎn)化為數(shù)字，可以是小數(shù)。
注意:這兩個(gè)方法會(huì)從左往右開(kāi)始，除去空格，找到第一位非0數(shù)字，開(kāi)始進(jìn)行轉(zhuǎn)換，直到轉(zhuǎn)換到不是數(shù)字的那位為止，或者，轉(zhuǎn)換出合適的值為止。

    console.log( parseInt( "1" ) );//1
    console.log( parseInt( "1.9" ) );//1
    console.log( parseInt( "20px" ) );//20
    console.log( parseInt( "    25px" ) );//25
    console.log( parseInt( "    0.0026px" ) );//0

    console.log( parseFloat( "    0.0026px" ) );//0.0026

5.Stirng( )和Boolean（）也可以進(jìn)行顯示類型轉(zhuǎn)化，這里不綴述

條件判斷中，除了null,undefined,"",NaN,false,0都轉(zhuǎn)化為false，其余都轉(zhuǎn)化為true。

6.隱式類型轉(zhuǎn)化

只有當(dāng)加法運(yùn)算時(shí)，其中一方是字符串類型，就會(huì)把另一個(gè)也轉(zhuǎn)為字符串類型。其他運(yùn)算只要其中一方是數(shù)字，那么另一方就轉(zhuǎn)為數(shù)字。并且加法運(yùn)算會(huì)觸發(fā)三種類型轉(zhuǎn)換：將值轉(zhuǎn)換為原始值，轉(zhuǎn)換為數(shù)字，轉(zhuǎn)換為字符串。

10.拷貝式繼承

11.class繼承

12.函數(shù)作用域，執(zhí)行上下文，變量提升，閉包

1.作用域

JS作用域分為全局作用域和函數(shù)作用域，函數(shù)作用域可以訪問(wèn)全局作用域中的變量，對(duì)象，函數(shù)等。但是函數(shù)作用域外部訪問(wèn)不到函數(shù)內(nèi)部的變量，對(duì)象，函數(shù)。

但在ES6中新增了塊級(jí)作用域。let，const在塊中聲明的變量，函數(shù)等，外部都訪問(wèn)不到。

    {
        var a=1;
        let b=2;
        console.log(b);//2
        {
            console.log(b);//2
        }
    }

    console.log(a);//1
    console.log(b);//報(bào)錯(cuò)，b is not defined

2.執(zhí)行上下文
這里有篇非常好的js執(zhí)行上下文的文章，可以點(diǎn)擊鏈接查看

總結(jié)：

        1. 調(diào)用函數(shù)是會(huì)為其創(chuàng)建執(zhí)行上下文，并壓入執(zhí)行環(huán)境棧的棧頂，執(zhí)行完畢彈出，執(zhí)行上下文被銷毀，隨之VO也被銷毀
        2. EC創(chuàng)建階段分創(chuàng)建階段和代碼執(zhí)行階段
        3. 創(chuàng)建階段初始變量值為undefined，執(zhí)行階段才為變量賦值
        4. 函數(shù)申明先于變量申明

3.變量提升（域解析）

關(guān)鍵：變量提升過(guò)程中函數(shù)優(yōu)先級(jí)高于變量?jī)?yōu)先級(jí)

        function foo() {
            console.log(f1);    //f1() {}
            console.log(f2);    //undefined
            
            var f1 = "hosting";
            var f2 = function() {}
            function f1() {}
        }
        foo();

4.閉包

閉包：函數(shù) A 返回了一個(gè)函數(shù) B，并且函數(shù) B 中使用了函數(shù) A 的變量，函數(shù) B 就被稱為閉包。

   for ( var i=1; i<=5; i++) {
    setTimeout( function timer() {
        console.log( i );
    }, i*1000 );
}

首先因?yàn)?setTimeout 是個(gè)異步函數(shù)，所有會(huì)先把循環(huán)全部執(zhí)行完畢，這時(shí)候 i 就是 6 了，所以會(huì)輸出一堆 6。

解決方法一：

for (var i = 1; i <= 5; i++) {
  (function(j) {
    setTimeout(function timer() {
      console.log(j);
    }, j * 1000);
  })(i);
}

解決方法二：

for ( var i=1; i<=5; i++) {
    setTimeout( function timer(j) {
        console.log( j );
    }, i*1000, i);
}

解決方法三：

for ( let i=1; i<=5; i++) {
    setTimeout( function timer() {
        console.log( i );
    }, i*1000 );
}

點(diǎn)擊這里，閉包進(jìn)一步了解

13.深淺拷貝

1.淺拷貝

首先可以通過(guò) Object.assign 來(lái)解決這個(gè)問(wèn)題。

let a = {
    age: 1
}
let b = Object.assign({}, a)
a.age = 2
console.log(b.age) // 1

當(dāng)然我們也可以通過(guò)展開(kāi)運(yùn)算符（…）來(lái)解決

let a = {
    age: 1
}
let b = {...a}
a.age = 2
console.log(b.age) // 1

2.深拷貝

function cloneFn( sourse ){
    var o = Object.prototype.toString.call(sourse).toLowerCase().indexOf("array")!==-1 ? [] : {};
    for( var attr in sourse ){
        if( (typeof sourse[attr] === "object") && sourse[attr] !== null ){
            o[attr] = cloneFn( sourse[attr] ) ;
        }else{
            o[attr] = sourse[attr];
        }
    }
    return o;
}