ATG精準科技-前端面試題

1.請寫出如下結果

for(var i=0; i<10; i++){
    setTimeout(function () {
        console.log(i)
    },10)
}

結果：打印10次190
解析：
考察的是做用域和異步的知識點，這是js特有的知識點，其它程序語言沒有
a：遇到異步代碼，程序不等待，而將代碼繼續執行下去，即for循環先執行完，而後再過來執行setTime裏的回調，此時i已被累加到10
b：因爲js語言沒有塊級做用域，故而定時器內的的i就是外部的i的值，因此定時器內部打印的那個i，早就是10了  

 

2.請依次寫下下列執行結果

var num=10;
var obj={
    num:8,
    inner:{
        num:6,
        print:function () {
            console.log(this.num);
        }
    }
}

//-----------解析-----------
num=888
//this表明上下文環境，誰調用，誰就是this，打印6,無可爭議，
obj.inner.print();

//全局調用，此時的fn函數內的this就被定向到window全局了，全局之中的num爲10,後來被改爲了888
var fn=obj.inner.print;
fn();//888

//這個跟obj.inner.print()沒區別
(obj.inner.print)();//6

//在全局下運行此函數，內部this指向的則爲window
// 能夠化解
// (obj.inner.print = function () {console.log(this.num);})()
// 再化簡
// (function () {console.log(this.num);})()  注意知識點(xxx=123)會返回123
//會發現等價於var fn=obj.inner.print;  fn()   
(obj.inner.print = obj.inner.print)();//888

 

3.請寫出下列結果

var a=1
b=a
a=2
console.log(b,a)

var arr=[0,1]
var arrs=arr
arr[0]=1
console.log(arr,arrs)

結果：1,2
解析：考察基本數據類型和引用數據類型的拷貝，也就是深拷貝與淺拷貝，
a 基本類拷貝是直接複製一份在棧內存，之後二者互不影響
b 引用類型拷貝，是指針指向同一個堆內存地址，共享同一個值，相互關聯

 

4 請寫出一下代碼執行結果

var z=10;
function  foo() {
    console.log(z)
}

(function(funArg) {
    console.log(z)
})(foo)

結果：10
解析：後邊那個自執行代碼直接打印全局z的值，完事了，至於傳參的那個函數，徹底是干擾視覺

 

5 請寫出如下結果

function fun(n,o) {
    console.log(o)
    return {
        fun:function(m){
            return fun(m,n)
        }
    }
}
var a=fun(0); a.fun(1); a.fun(2); a.fun(3)
var b=fun(0).fun(1).fun(2).fun(3)
var c=fun(0).fun(1); c.fun(2);c.fun(3)

結果：一看題，就尼瑪不想看了，長-亂

 

6 請輸出一下結果，並解釋緣由

function  test() {
    console.log(a) //undefined，js語言特性（bug），聲明提高，賦值不會提高
    console.log(foo())  //2  js語言特性（bug）,聲明式函數存在提高
    var a=1;
    function foo() {
        return 2
    }
}
test()

 

7  一行代碼實現一下數組去重

var arr=[1,1,1,1,2,2,2,2,3,3,3,3,4,4,4,4,5,5]

//想考我es6是吧，太簡單，es新增數據集合類型set，其特性就是不重複. 再結合es6給數組類新增的靜態方法from構建新數組
console.log(Array.from(new Set(arr)))

 

8 請輸出一下結果

var a={n:1}
var b=a;

// js的賦值運算順序是從右往左的，
// 不過因爲「.」是優先級最高的運算符，因此這行代碼先「計算」了a.x
// 這時候發生了這個事情——a指向的對象{n:1}新增了屬性x（雖然這個x是undefined的）
// 而後接下來a={n:2} 使得a被從新指向堆內存中新的對象地址
//此時a和b是徹底無關聯的 對象
// 具體可參考：https://blog.csdn.net/yang295242361/article/details/78149872
a.x=a={n:2} 
console.log(a.x) //undefined
console.log(b.x) //Object

 

9 vue中 請寫出一種實現無縫輪播的組件（思路）
請百度

10 請簡述vue聲明週期
能夠總共分爲8個階段：建立前/後, 載入前/後,更新前/後,銷燬前/銷燬後
簡介經常使用的3個

created: 實例已經建立完成以後調用,在這一步,實例已經完成數據觀測, 屬性和方法的運算, watch/event事件回調. 然而, 掛載階段尚未開始, $el屬性目前還不可見
mounted: el被新建立的 vm.$el 替換，並掛載到實例上去以後調用該鉤子。若是 root 實例掛載了一個文檔內元素，當 mounted 被調用時 vm.$el 也在文檔內。
activated: keep-alive組件激活時調用