小说阅读网站,怎样写网络小说

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷(xiāo)解決方案

那些陌生又熟悉的前端面試題

1、嚴(yán)格模式與非嚴(yán)格模式的區(qū)別，你了解多少?

JavaScript 語(yǔ)言是一門(mén)弱類(lèi)型語(yǔ)言，存在許多類(lèi)型錯(cuò)誤，因此 ES6 引入了嚴(yán)格模式概念。

創(chuàng)新互聯(lián)于2013年創(chuàng)立，是專(zhuān)業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司，擁有項(xiàng)目成都網(wǎng)站制作、成都網(wǎng)站設(shè)計(jì)網(wǎng)站策劃，項(xiàng)目實(shí)施與項(xiàng)目整合能力。我們以讓每一個(gè)夢(mèng)想脫穎而出為使命，1280元建安做網(wǎng)站,已為上家服務(wù),為建安各地企業(yè)和個(gè)人服務(wù),聯(lián)系電話:18982081108

如果不加 ‘use strict’ 常規(guī)模式下就是屬于非嚴(yán)格模式。

嚴(yán)格模式

在 js 文件頂部添加 ‘use strict’ 就屬于嚴(yán)格模式，嚴(yán)格模式也可以指定在函數(shù)內(nèi)部。

嚴(yán)格模式，是為 js 定義來(lái)了一種不同的解析與執(zhí)行模型，在嚴(yán)格模式下，ECMAScipt 3 中一些不解和不確定的行為將得到處理，而且會(huì)對(duì)不安全的操作會(huì)拋出異常?！畊se strict’ 會(huì)告訴瀏覽器引擎可以切換到嚴(yán)格模式執(zhí)行。

嚴(yán)格模式與非嚴(yán)格模式區(qū)別

2、深淺拷貝的區(qū)別有哪些?

常見(jiàn)筆試題：

var person = {
 name:"前端人",
 hobby:['學(xué)習(xí)','敲代碼','潛水']
}
function copy(source){
 var newObj = new Object()
 for(var i in source){
  if(source.hasOwnProperty(i)){
   newObj[i] = source[i]
   }
  }
 return newObj
}
var p1 = copy(person);
p1.name = "Web Person"
console.log(person.name)
console.log(p1.name)
p1.hobby = ["內(nèi)卷"]
console.info(person.hobby)
console.info(p1.hobby)
/*運(yùn)行結(jié)果：
前端人
 Web Person
["學(xué)習(xí)", "敲代碼", "潛水"]
["內(nèi)卷"]
*/

試試這道筆試題你會(huì)做嗎?

要說(shuō) js 的深淺拷貝，就不得不提 js 的兩大數(shù)據(jù)類(lèi)型：基本數(shù)據(jù)類(lèi)型和引用類(lèi)型。

基本數(shù)據(jù)類(lèi)型的變量名和值都存儲(chǔ)在棧中，對(duì)于引用類(lèi)型的變量名存儲(chǔ)在棧中，而值存儲(chǔ)在堆中。由于存儲(chǔ)方式不同，所以導(dǎo)致了他們復(fù)制的時(shí)候方式不同。

賦值

基本數(shù)據(jù)類(lèi)型賦值的時(shí)候，創(chuàng)建的基本數(shù)據(jù)類(lèi)型會(huì)在內(nèi)存中開(kāi)辟一個(gè)新空間把值復(fù)制過(guò)來(lái)，而引用類(lèi)型采用的是地址存儲(chǔ)，如果直接把一個(gè)引用數(shù)據(jù)直接賦值給另外一個(gè)數(shù)據(jù)，就相當(dāng)于直接把自己存儲(chǔ)值的地址給了另外一個(gè)變量，所以改變一個(gè)的值，也會(huì)改變另外一個(gè)的值。

var a = 1;
var b = a;
b=2;
console.log(a) //1
console.log(b)//2
var p1 = {name:"前端人"}
var p2 = p1
p2.name = "打工仔"
console.log(p1.name) // '打工仔'
console.log(p2.name) // '打工仔'

深淺拷貝是如何定義的?

假設(shè)有 p 和 copyP 兩個(gè)變量，如果copyP 是拷貝了 p 的，我們通過(guò)修改 copyP 來(lái)觀察 p 是否發(fā)生改變，如果跟著改變，就是淺拷貝，如果是不改變，就說(shuō)明是深拷貝。

基本類(lèi)型復(fù)制的時(shí)候會(huì)開(kāi)辟新的內(nèi)存空間，所以兩個(gè)值是相互獨(dú)立的，引用類(lèi)型復(fù)制的時(shí)候就要看是復(fù)制的內(nèi)存地址還是復(fù)制一個(gè)新的堆。所以深拷貝主要針對(duì)的是引用類(lèi)型的數(shù)據(jù)。

淺拷貝的常見(jiàn)的方式：

1、直接賦值

var arr1 = [1,2,3,4];
var arr2 = arr1;

2、Object.assign

var obj = {
 a:1,
 b:2
}
var o = Object.assign(obj)

深拷貝的常見(jiàn)方式：

引用數(shù)據(jù)類(lèi)型最常用的就是 Object 和 Array ，引用數(shù)據(jù)內(nèi)部的數(shù)據(jù)也可以是多樣化的，進(jìn)行深拷貝時(shí)，也要適當(dāng)?shù)馗鶕?jù)數(shù)據(jù)結(jié)構(gòu)進(jìn)行合適的復(fù)制方式，具體的深拷貝方法分別有：

1、數(shù)組中只包含基本數(shù)據(jù)類(lèi)型

循環(huán)數(shù)組，將數(shù)組的值復(fù)制出來(lái)放入另一個(gè)新數(shù)組中
利用 slice 方法
借助 concat 方法
利用 from 方法
使用擴(kuò)展符 ...

2、對(duì)象中只包含基本數(shù)據(jù)類(lèi)型

利用 for in 循環(huán)，將對(duì)象的值拿出來(lái)
使用 Object 復(fù)制給一個(gè)新的空對(duì)象
使用 ... 擴(kuò)展運(yùn)算符
手動(dòng)復(fù)制，將屬性值一個(gè)一個(gè)單獨(dú)復(fù)制

3、對(duì)象或數(shù)組里含有一層或多層引用數(shù)據(jù)類(lèi)型時(shí)

使用 jQuery 的 extend 方法
JSON.parse(JSON.stringify())
使用遞歸自己寫(xiě)一個(gè)深拷貝的方法

深淺拷貝的常見(jiàn)應(yīng)用主要是數(shù)據(jù)的增刪改操作。

3、this 的指向

大廠筆試題：

var name = 'window name'
var p1 = {
 name:'p1 name',
 showName:function(){
  console.info(this.name)
 }
}
var fn = p1.showName
fn()
p1.showName()
var p2 = {
 name:'p2 name',
 showName:function(fun){
  fun()
 }
}
p2.showName(p1.showName)
p2.showName = p1.showName
p2.showName()
/*
運(yùn)行結(jié)果：
window name
 p1 name
 window name
 p2 name
*/

這是一道關(guān)于 this 指向的面試題，接下來(lái)我們就說(shuō)說(shuō) this 是如何指向的?

this 對(duì)象是運(yùn)行時(shí)基于函數(shù)的執(zhí)行環(huán)境綁定的：

在全局函數(shù)中，this 等于 window 。
函數(shù)上下文調(diào)用，嚴(yán)格模式下 this 為 undefined ，非嚴(yán)格模式下，this 指向 window 。
當(dāng)函數(shù)被作為某個(gè)對(duì)象的方法被調(diào)用時(shí)，this 等于那個(gè)對(duì)象。如果使用 call apply 改變當(dāng)前 this 時(shí)，將會(huì)指向?yàn)閭鬟f過(guò)來(lái)的那個(gè) this 。
匿名函數(shù)的執(zhí)行環(huán)境具有全局性，因此 this 指向 window。
構(gòu)造函數(shù)內(nèi)的 this 指向創(chuàng)建的實(shí)例對(duì)象。
dom 事件處理函數(shù)，this 指向觸發(fā)該事件的元素。
setTimeout 和 setInterval 中的 this 指向全局變量 window

看完上述 this 指向解釋?zhuān)憔涂梢宰錾线叺哪堑烂嬖囶}了。

如何改變 this 的指向?

call 、bind 和 apply 這三個(gè)函數(shù)都是用來(lái)改變 this 指向的，就是改變函數(shù)執(zhí)行時(shí)的上下文。

修改上述面試題：

var name = 'window name'
var p1 = {
 name:'p1 name',
 showName:function(){
  console.info(this.name) // p2 name
 }
}
var p2 = {
 name:'p2 name',
}
p1.showName.call(p2)
p1.showName.apply(p2)
var bind = p1.showName.bind(p2)
bind()

call 、bind 和 apply 改變 this 指向，最大作用就是實(shí)現(xiàn)代碼復(fù)用。

至于 call、bind 和 apply 的區(qū)別，可以自行去了解下。

4、隱式轉(zhuǎn)化

console.log( '2'>10 ) //false
console.log( '2'>'10' ) //true
console.log( 'abc'>'b' ) //false
console.log( 'abc'>'aab' ) //true
console.log( undefined == null ) //true
console.log( NaN == NaN )//false
console.log( [] == 0 ) //true
console.log( ![] == 0 ) //true
console.log( [] == [] ) //false
console.log( {} == {} ) //false
console.log( {} == !{} ) //false

對(duì)象的類(lèi)型轉(zhuǎn)換表

有了上邊那個(gè)表，事情就變得簡(jiǎn)單了!

關(guān)系運(yùn)算符進(jìn)行運(yùn)算時(shí)，不同類(lèi)型的值會(huì)自動(dòng)轉(zhuǎn)化為相同類(lèi)型值，然后進(jìn)行

1、兩邊有一個(gè)是字符串一個(gè)是是數(shù)字時(shí)，字符串調(diào)用 Number 方法，將字符串轉(zhuǎn)為數(shù)字，所以：

console.log( '2'>10 )  => console.log( 2>10 )

2、如果兩邊都是字符串時(shí)，按照字符串的 unicode 編碼來(lái)轉(zhuǎn)換的，所以：

'2'.charCodeAt() = 50
'10'.charCodeAt() = 49
console.log( '2'>'10' ) => console.log( 50 >49 )

3、字符串進(jìn)項(xiàng)比較時(shí)，先比較第一位，如果不相等直接得出結(jié)果，如果第一項(xiàng)相等，會(huì)繼續(xù)使用第二項(xiàng)進(jìn)行比較。

console.log( 'abc'>'b' ) // a < b 所以為 false
console.log( 'abc'>'aab' ) // a=a 第二位 b>a 所以為 true

4、轉(zhuǎn)為布爾值都為 false 的類(lèi)型分別有：undefined 、null 、0、NaN、false、‘’

console.log( undefined == null ) //true

5、NaN表示的是非數(shù)字，但是這個(gè)非數(shù)字也是不同的，因此 NaN 不等于 NaN，兩個(gè)NaN永遠(yuǎn)不可能相等。

console.log( NaN == NaN )//false

6、關(guān)系運(yùn)算有一個(gè)數(shù)值，將另外一個(gè)值也轉(zhuǎn)為 number 類(lèi)型。

Number([].valueOf().toString()) = 0
console.log( [] == 0 ) => console.log( 0 == 0 ) //true

7、有邏輯運(yùn)算的，將其他數(shù)據(jù)類(lèi)型轉(zhuǎn)為 boolean 值。

Boolean([]) = true => 取反 true
console.log( ![] == 0 ) => console.log( false == false ) //true

8、直接使用兩個(gè)空數(shù)組比較，數(shù)組地址不同，所以不相等。

console.log( [] == [] ) //false
// 對(duì)象地址不一樣
console.log( {} == {} ) //false

{}.valueOf().toString() ="[object Object]"
console.log( {} ==

當(dāng)前標(biāo)題：那些陌生又熟悉的前端面試題
網(wǎng)站URL：http://fisionsoft.com.cn/article/dphdodh.html