JavaScript中in運算子有什麼用法中in運算子有什麼用法呢?這篇文章就來跟大家介紹關於JavaScript中in運算子有什麼用法中in運算子的用法,下面我們來看具體內容。
首先我們來看in運算子在物件上面的使用
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> function exec() { var data = new Object(); data.id = 10; data.name = "曲奇饼干"; data.price = 150; data.code = "PK-01"; var elem = document.getElementById("output"); var fieldname = "price"; if (fieldname in data == true) { elem.innerText = "data 至" + fieldname + " 字段存在。"; } else { elem.innerText = "data 至 " + fieldname + "字段不存在。"; } } </script> </head> <body> <input type="button" value="Exec" onclick="exec();" /> <div id="output">输出</div> </body> </html>說明:使用下列程式碼建立物件並指派值。
var data = new Object(); data.id = 10; data.name = "曲奇饼干"; data.price = 150; data.code = "PK-01";使用in運算子檢查指派給fieldname變數的欄位(成員)是否存在於物件和物件中。在這段程式碼中,是確認「price」是否存在於物件中的程式碼,因為在先前的物件的初始化部分向price的值的代入,in運算的結果變成true,在輸出區域顯示「data中price字段存在」的訊息。
var elem = document.getElementById("output"); var fieldname = "price"; if (fieldname in data == true) { elem.innerText = "data 中 " + fieldname + " 字段存在"; } else { elem.innerText = "data 中" + fieldname + " 字段不存在。"; }運行結果使用網頁瀏覽器顯示上述HTML文件,將顯示如下所示的效果。 點擊[Exec]按鈕,將顯示訊息「data中price欄位存在」,效果如下。
結果為false的範例
#將先前的HTML檔案的exec函數部分變更為以下程式碼。var fieldname ="price";變成
var fieldname = "detail";因為data物件沒有,所以in運算的結果是fale。
function exec() { var data = new Object(); data.id = 10; data.name = "曲奇饼干"; data.price = 150; data.code = "PK-01"; var elem = document.getElementById("output"); var fieldname = "detail"; if (fieldname in data == true) { elem.innerText = "data 中" + fieldname + " 字段存在。"; } else { elem.innerText = "data 中 " + fieldname + "字段不存在。"; } }運行結果使用網頁瀏覽器顯示上述HTML文件,將顯示如下所示的效果。 點選[Exec]按鈕,將顯示訊息「data中price欄位不存在」,效果如下。
在陣列中使用in運算子
#在陣列中使用in運算子時,可以確定指定位置的陣列元素是有效還是無效(= undefined)。 我們來看具體的範例程式碼如下<br/>說明:初始化陣列並透過以下程式碼賦值。
var data = new Array("Penguin", "Duck", "Pigion", "Owl", "Hawk");它透過使用in運算子判斷陣列資料的第二個元素是否有效。此程式碼排列建立後,因為沒有特別的處理,所以他是有效的結果是true,在頁面上顯示「第二個元素有效。」的字元。
var elem = document.getElementById("output"); if (2 in data == true) { elem.innerText = "第二个元素有效。"; } else { elem.innerText = "第二个元素无效。"; }執行結果
元素變成無效時的程式碼
#將上面的HTML檔案更改為以下程式碼。說明:更改點是新增程式碼以刪除以下exec函數中的元素。 输出
function exec() { var data = new Array("Penguin", "Duck", "Pigion", "Owl", "Hawk"); delete data[2]; var elem = document.getElementById("output"); if (2 in data == true) { elem.innerText = "第二个元素有效。"; } else { elem.innerText = "第二个元素无效。"; } }透過下面的程式碼,刪除data陣列的第二個元素(第三個)。由於元素不會被delete刪除,刪除前後數組的長度不會改變。但是,由於data[2]的元素已被刪除,因此data[2]是undefined。
delete data[2];執行結果使用網頁瀏覽器顯示上述HTML檔案。將顯示如下所示的效果。 按一下[Exec]按鈕,由於已使用delete指令刪除了data[2],因此輸出欄位中將顯示「第二個元素無效」的資訊。
以上是JavaScript中in運算子有什麼用法的詳細內容。更多資訊請關注PHP中文網其他相關文章!