几道比较有意思的js面试题
1、[] ? !![] : ![];輸出結果是什么?
| 1 2 3 4 5 | let?val?=?[]???!![]?:?![]; console.log(val);? //true: //之前的錯誤解釋:[]?是一個null,做判斷則為false,false執行![]語句,結果為非空,即true //更正:[]是一個object,object判斷為true(null實際上也是一個object不過比較特殊是6種false之一),true執行?!![]?兩次取反為true.多謝@此生只為你傾心指正。 |
這里順便說明一下,js用于做判斷,只有以下6種情況判斷出來的值為false:
值為false:????false????0????null????""(空字符串)????undefined????NaN? ?
其他均為true。
延展一下,有個比較有意思的情況是:[] == ![]; //true,
還有[]我們剛剛判斷為true對吧? 但是呢 [] == false;? //true,
為什么呢?
==?:趨向于先轉換成0和1再做判斷,一起來看看吧
????? ? 先看[] == false首先把比較的雙方轉成number(雙方有一方是布爾值),[]是空數組,轉換成基本類型為"",空所以被轉化為0,false也被轉成0。0 == 0,true(不過如果用恒等于 ===則為false,因為兩者數據類型不一致,[]為object(里的array),false為布爾值)
????????再看[] == ![]; []是object即true,!true ==> false;? false ==> 0; 而[]我們知道最終轉化為0,所以 0 == 0; //true;
????????[] == [] 實際上是false哈。是不是很別扭?
所以:慎用 "==",用“===”
2、下面代碼輸出什么?
| 1 2 3 4 | let?k; for(let?i?=?0,j?=?0;i?<?10,j?<?8;?i++,?j++){ ??k?=?i?+?j; } |
????????答案是:14。這里的i和j是同步增長,當j加到7的時候,i也等于7,k執行等于14,j再加1,不滿足條件,跳出循環,結果為14,如果再問i和j的值,則都為8。
3、有這樣一串雜亂無章的數據————dahsidoai 213907;a? poas198jdo 213089 as13d115。
? ? ? 我希望它輸出["213907", "198", "213089", "13", "115"],請寫出實現過程
| 1 2 3 4 5 6 7 8 9 10 11 12 | let?str?=?"dahsidoai?213907;a??poas198jdo?213089?as13d115"; function?searchNumUnit(str){ ??let?arr?=?[], ?????str0?=?str,?//不影響原數據 ?????reg?=?/\d+/; ??while(reg.test(str0)){ ????arr.push(reg.exec(str0)[0]); ????str0?=?str0.split('').slice(reg.exec(str0).index?+?reg.exec(str0)[0].length,str0.length).join(''); ??} ??return?arr; } console.log(searchNumUnit(str)); |
第2種方法,利用js的match函數提取字符串:
| 1 2 | let?str?=?"dahsidoai?213907;a??poas198jdo?213089?as13d115"; console.log(str.match(/\d+/g));//感謝慕姐704907 |
4、下面是一道綜合題,問題會由淺及深一步步問,你需要一步步解決:
????????下面的程序輸出什么?假如說我用"==>"表示程序延遲了多久輸出,比如1,2 ==> 3 ,表示12同時輸出,之后間隔1000ms(為避免鉆牛角尖,這里的1000只是一個大概數)輸出了3
| 1 2 3 4 5 6 | for(var?i?=?0;?i?<?6;?i?++){ ??setTimeout(function(){ ????console.log(i); ??},1000); } //?輸出結果:6,6,6,6,6,6 |
那我如果想輸出0 , 1 , 2 , 3 , 4 , 5呢?得怎么寫?能否通過多種方式來寫出?(最少2種)
| 1 2 3 4 5 6 7 8 | //第1種方式: for(var?i?=?0;?i?<?6;?i?++){ ??(function(j){ ????setTimeout(function(){ ??????console.log(j); ????},1000); ??})(i) } |
| 1 2 3 4 5 6 7 | //第2種方式: for(let?i?=?0;?i?<?6;?i?++){ ??setTimeout(function(){ ????console.log(i); ??},1000); } //輸出結果:0?,?1?,?2?,?3?,?4?,?5 |
那我如果是想輸出0 ==> 1 ==> 2 ==> 3 ==> 4 ==> 5程序得怎么改變?
| 1 2 3 4 5 6 7 8 | //?代碼如下: for(var?i?=?0;?i?<?6;?i?++){ ??(function(j){ ????setTimeout(function(){ ??????console.log(j); ????},1000?*?j); ??})(i) } |
???????上面這種代碼能實現邏輯,但代碼太爛,沒法給你加分,有沒有更好的辦法?另外我為什么說你的代碼太爛?能順便說明一下嗎?
| 1 2 3 4 5 6 7 | //首先我的代碼太爛是因為我創建了太多的定時器,僅僅這里我就創建了6個定時器,如果i值非常大,會非常消耗資源,大大降低執行性能 //優化代碼如下:這里的好處是即使你的i1值達到10000甚至1億,我始終只有1個定時器。 let?i1?=?0; let?time?=?setInterval(output_i1,1000); function?output_i1(){ ??i1?<?6???console.log("i1="?+?i1++)?:?clearInterval(time); } |
????????這樣算可以給你加5分,如果我不是0 , 1 , 2 , 3 , 4 , 5呢?而是0,1,2,3,4,5...簡單的說能否給我自定義?
這個簡單啊,改成這樣不就可以了?
| 1 2 3 4 5 | let?i1?=?0; let?time?=?setInterval(output(6),1000); function?output(num){ ??i1?<?num-1???console.log(++i1)?:?clearInterval(time); } |
????????可惜你這個函數是錯的,setInterval接收的是一個function:output,而不是接收一個已經運行的output(),所以呢?你得怎么改?
| 1 2 3 4 5 6 7 8 9 10 11 | //改成這樣: let?i2?=?0; let?time1?=?setInterval(_output_i2(8),1000); function?_output_i2(num){ ??return?function(){ ????output_i2(num); ??} } function?output_i2(num){ ??i2?<?num???console.log("i2="+?i2++)?:?clearInterval(time1); } |
????????如果你到了這一步,嗯,還行,勉強達到了基本要求,但是呢,其實這里涉及到異步,用promise又得怎么寫?還能再進一步嗎?答案是肯定的,不過呢,先答下一題吧。
?
5、這是一道簡單的數據處理題
一個樹形json數據有3層,基本的結構如下:(...代表后續有若干個類似的對象)
數據大概是這樣:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | [ ??{ ????id?:?"1", ????name?:?"dorsey1", ????children:?[ ??????{ ????????id?:?"1-1", ????????name?:?"dorsey1-1", ????????children?:?[ ??????????{ ????????????id?:?"1-1-1", ????????????name?:?"dorsey1-1-1", ????????????children?:?[ ??????????????{ ????????????????id?:?"1-1-1-1", ????????????????name?:?"dorsey1-1-1-1", ??????????????} ?????????????... ????????????] ??????????} ????????... ????????] ??????} ?????... ????] ??} ?... ] |
請寫一個函數傳入id值返回name值,另外呢?這里雖說只是3層,能否拓展到若干層?
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 | let?data?=?[ ??{ ??id?:?"1", ??name?:?"dorsey1", ??children:?[ ????{ ??????id?:?"1-1", ??????name?:?"dorsey1-1", ??????children?:?[ ????????{ ??????????id?:?"1-1-1", ??????????name?:?"dorsey1-1-1", ??????????children?:?[ ????????????{ ??????????????id?:?"1-1-1-1", ??????????????name?:?"dorsey1-1-1-1", ????????????} ??????????] ????????}, ????????{ ??????????id?:?"1-1-2", ??????????name?:?"dorsey1-1-2" ????????} ??????] ????}, ????{ ??????id?:?"1-2", ??????name?:?"dorsey1-2", ??????children?:?[ ????????{ ??????????id?:?"1-2-1", ??????????name?:?"dorsey1-2-1" ????????}, ????????{ ??????????id?:?"1-2-2", ??????????name?:?"dorsey1-2-2" ????????} ??????] ????}, ????{ ??????id?:?"1-3", ??????name?:?"dorsey1-3", ??????children?:?[ ????????{ ??????????id?:?"1-3-1", ??????????name?:?"dorsey1-3-1" ????????}, ????????{ ??????????id?:?"1-3-2", ??????????name?:?"dorsey1-3-2" ????????} ??????] ????} ????] ??}, ??{ ????id?:?"2", ????name?:?"dorsey2", ????children:?[ ??????{ ????????id?:?"2-1", ????????name?:?"dorsey2-1", ????????children?:?[ ??????????{ ????????????id?:?"2-1-1", ????????????name?:?"dorsey2-1-1" ??????????}, ??????????{ ????????????id?:?"2-1-2", ????????????name?:?"dorsey2-1-2" ??????????} ????????] ??????}, ??????{ ????????id?:?"2-2", ????????name?:?"dorsey2-2", ????????children?:?[ ??????????{ ????????????id?:?"2-2-1", ????????????name?:?"dorsey2-2-1" ??????????}, ??????????{ ????????????id?:?"2-2-2", ????????????name?:?"dorsey2-2-2" ??????????} ????????] ??????} ????] ??} ] |
這是基本的json解析,請看下面的實現:
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | //最原始的實現如下: function?getJsonDataNameById(dataArr,id)?{ ??let?agent?=?[]; ??let?data?=?dataArr, ??len?=?data.length; ??for?(let?i?=?0;?i?<?len;?i++)?{ ????let?item?=?data[i]; ????if(item.children?&&?item.children.length?!==?0){ ??????for(let?j?=?0?;?j?<?item.children.length;?j?++){ ????????agent.push(item.children[j]); ??????} ??????data?=?data.concat(agent);?//children降維 ??????len?+=?agent.length; ??????agent?=?[]; ????} ??} ??for(let?i?=?0;?i?<?data.length;?i++){ ????if(data[i].id?===?id){ ??????return?data[i].name; ????} ??} } let?a?=?getJsonDataNameById(data,?"1-3-2"); console.log(a); |
作者:dorseyCh
鏈接:https://www.imooc.com/article/48993
來源:慕課網
本文原創發布于慕課網 ,轉載請注明出處,謝謝合作
轉載于:https://www.cnblogs.com/justBobo/p/10740542.html
創作挑戰賽新人創作獎勵來咯,堅持創作打卡瓜分現金大獎總結
以上是生活随笔為你收集整理的几道比较有意思的js面试题的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 蓝桥杯常考算法 + 知识点
- 下一篇: 五、Nacos集群部署实现原理