Javascript中幾個看起來簡單，卻不一定會做的題

itvincent 發布于2019-08-22 15:43 / 377人閱讀

摘要：作為前端開發必須掌握的一門語言，因為語言的靈活性，有些知識點看起來簡單，在真正遇到的時候，卻不一定會直接做出來，今天我們就一起來看看幾道題目吧題目這道題考察的知識點是運算符的優先級。

Javascript作為前端開發必須掌握的一門語言，因為語言的靈活性，有些知識點看起來簡單，在真正遇到的時候，卻不一定會直接做出來，今天我們就一起來看看幾道題目吧

題目1

var val = "smtg";

console.log(" Value is" + (val === "smtg") ? "Something" : "Nothing");

這道題考察的知識點是運算符的優先級。

首先，小括號的優先級是最高的，所以首先會做判斷，val與smtg相等返回true。因此最后這道題等價于判斷是執行下面的語句1還是語句2.

//語句1

"Value is" + (true ? "Something" : "Nothing");

//語句2

"Value is true" ? "Something" : "Nothing";

根據運算符優先級我們知道，連接元算符+的優先級要高于條件運算符？的優先級，因此實際執行的是語句2，所以最后返回的結果是

"Something".

題目2

我們再來看看下面這道題。

  var ary = [0,1,2];

  ary[6] = 6;

  var result = ary.filter(function(x){

　　return x === undefined; 

  });

  console.log(result);

這道題考察的時候數組的初始化和filter方法。

第一眼看上去，以為會輸出[undefined,undefined,undefined],但是實際輸出卻是undefined，為什么會這樣？

這是因為在JavaScript里存在稀疏數組的概念，數組在初始化時，只會對已經確定索引的選項進行初始化，對于不存在索引的選項不進行初始化，通過以下代碼可以確定。

  0 in ary；//true

  1 in ary；//true

  3 in ary；//false　    

  4 in ary；//false

  6 in ary；//true

對數組使用in運算符時，是通過枚舉數組的索引，通過3和4返回false可以知道，ary[3]和ary[4]實際是不存在的，未進行初始化。

我們再來看看 Array.prototype.filter方法和polyfill，注意代碼中標注的地方。

Array.prototype.filter = function(fun /*thisArg*/){

　　if(this === void 0 || this === null){

　　　　throw new TypeError();

　　}

　　var t = Object(this);

　　var len = t.length >>> 0;

　　if(typeof fun !== "function"){

　　　　throw new TypeError();

　　}

　　var res = [];

　　var thisArg = arguments.length >=2 ? arguments[1]:void 0;

　　for(var i = 0;i
在filter方法源碼中，我發現使用了in運算符，而arg數組沒有對索引為3，4，5的值進行初始化，因此會直接跳過執行，所以最后返回undefined。
題3
function caseshow(val){

　　switch(val){

　　　　switch(value){

　　　　　　case "A":

　　　　　　　　console.log("A");

               break;

　　　　　　　case "B":

　　　　　　　　console.log("B");

               break;

　　　　　　   case "C":

　　　　　　　　console.log("C");

                     　　 break;

　　　　　　default:
　　　　　　　　console.log("do not know!");

　　　　}　　        

　　}      

}    

caseshow(new String("A"));

咋一看，很多人會以為輸出"case A"，但實際輸出"do not know"。why? 這道題考察的知識點是：switch和string，我們需要知道一下兩點：
1，JavaScript中switch執行的是嚴格相等（===）。 2，字符串和string的實例不一樣。
第二點我們可以測試下。
var s_p = "foo"; var s_o = new String(s_p)

console.log(typeof s_p) //"string" 
console.log(typeof s_o) //"object"
console.log(s_p === s_o)  //"false"


因此針對題目中的"A"與String("A")并不嚴格相等，最終會返回‘do not know’
題4 針對上面的題目3，我們稍作一點改動，成為下面的題目4，再看看結果輸出什么？
function caseshow2(val){ 
    switch(val){ 　　
       case "A":
　　　　console.log("A");
　　　　break; 　　case "B":
　　　　console.log("B");
　　　　break; 　　case undefined:
　　　　console.log("undefined");
　　　　break; 　　default:
　　　　console.log("do not know!"); 
　} } 
　　　caseshow2(String("A"));


　　　　題目4相對于題目3，只是在最后調用的時候傳入的參數是String("A")，它的結果就變成了"Case A"。這是為什么呢？
其實很簡單，String(X)返回的是一個字符串而不會生成一個新的String實例，因此與"A"是嚴格相等的

云服務器 GPU云服務器簡單js做的特效簡單javascript javascript簡單教程簡單的javascript

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/93688.html

為什么你學不會遞歸？刷題幾個月，告別遞歸，談談我的經驗

摘要：第一遞歸函數功能假設的功能是求第項的值，代碼如下找出遞歸結束的條件顯然，當或者我們可以輕易著知道結果。定義遞歸函數功能假設函數的功能是反轉但鏈表，其中表示鏈表的頭節點。可能很多人在大一的時候，就已經接觸了遞歸了，不過，我敢保證很多人初學者剛開始接觸遞歸的時候，是一臉懵逼的，我當初也是，給我的感覺就是，遞歸太神奇了！可能也有一大部分人知道遞歸，也能看的懂遞歸，但在實際做題過程中，卻不知道怎么...

Achilles 2019-05-23 17:29 評論0 收藏0
不可變數據

摘要：為什么要有不可變數據首先，不可變數據類型是源于函數式編程中的，是一條必備的準則。另外在中的廣泛應用，也讓函數式編程火熱，而函數式編程最重要的原則之一就是不可變數據，所以你在使用的時候，改變必須返回新的。不可變數據引入我是通過使用 React 才去關注 immutable data 這個概念的。事實上，你去搜 immutable 的 JS 相關文章，也基本都是近兩年的，大概是隨著 ...

lanffy 2019-08-21 17:37 評論0 收藏0
JavaScript中幾個重要的知識點（1） ---- 面向對象

摘要：中幾個最重要的大知識點面向對象事件異步交互面向對象在中可以把任意的引用和變量都看成是一個對象。我們可以寫一個通用方法來模擬面向對象語言的多態 JavaScript中幾個最重要的大知識點面向對象 DOM事件異步交互ajax 面向對象在JS中可以把任意的引用和變量都看成是一個對象。面向對象的主要三個表現形式：封裝繼承多態 1. 封裝 1.1 單例模式 var obj={...

acrazing 2019-08-20 17:32 評論0 收藏0
JavaScript中幾個重要的知識點（2） ---- DOM事件

摘要：使用來移除事件，參數必須與要移除的事件處理函數地址指針相同。在低版本瀏覽器中，綁定級事件的方法為中的級事件的事件處理程序都是在冒泡階段執行的。 JavaScript中幾個最重要的大知識點面向對象 DOM事件異步交互ajax 事件事件就是文檔和瀏覽器的瞬間交互行為 1.事件類型點擊: click 滾輪: scroll 滑動: move 進入: enter 加載: load ...

dantezhao 2019-08-20 17:33 評論0 收藏0