js 关键字 in 的使用方法
寫js的時候需要遍歷一個對象的屬性，把屬性名和屬性值都提出來，之前沒遇到這種需求，查了一下可以用for in的方式.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | var?obj = { ????"key1":"value1", ????"key2":"value2", ????"key3":"value3" }; function?EnumaKey(){ ????for(var?key?in?obj ){ ????????alert(key); ????} } function?EnumaVal(){ ????for(var?key?in?obj ){ ????????alert(obj[key]); ????} } |
數組也可以這樣遍歷，但不推薦，因為不能保證順序，而且如果在Array的原型上添加了屬性，這個屬性也會被遍歷出來。
for-in循環應該用在非數組對象的遍歷上，使用for-in進行循環也被稱為“枚舉”。
從技術上將，你可以使用for-in循環數組（因為JavaScript中數組也是對象），但這是不推薦的。因為如果數組對象已被自定義的功能增強，就可能發生邏輯錯誤。另外，在for-in中，屬性列表的順序（序列）是不能保證的。所以最好數組使用正常的for循環，對象使用for-in循環。
有個很重要的hasOwnProperty()方法，當遍歷對象屬性的時候可以過濾掉從原型鏈上下來的屬性。
思考下面一段代碼：
// 對象 var man = {hands: 2,legs: 2,heads: 1 };// 在代碼的某個地方 // 一個方法添加給了所有對象 if (typeof Object.prototype.clone === "undefined") {Object.prototype.clone = function () {}; }在這個例子中，我們有一個使用對象字面量定義的名叫man的對象。在man定義完成后的某個地方，在對象原型上增加了一個很有用的名叫 clone()的方法。此原型鏈是實時的，這就意味著所有的對象自動可以訪問新的方法。為了避免枚舉man的時候出現clone()方法，你需要應用hasOwnProperty()方法過濾原型屬性。如果不做過濾，會導致clone()函數顯示出來，在大多數情況下這是不希望出現的。
// 1. // for-in 循環 for (var i in man) {if (man.hasOwnProperty(i)) { // 過濾console.log(i, ":", man[i]);} } /* 控制臺顯示結果 hands : 2 legs : 2 heads : 1 */// 2. // 反面例子: // for-in loop without checking hasOwnProperty() for (var i in man) {console.log(i, ":", man[i]); } /* 控制臺顯示結果 hands : 2 legs : 2 heads : 1 clone: function() */另外一種使用hasOwnProperty()的形式是取消Object.prototype上的方法。像這樣：
for (var i in man) {if (Object.prototype.hasOwnProperty.call(man, i)) { // 過濾console.log(i, ":", man[i]);} }其好處在于在man對象重新定義hasOwnProperty情況下避免命名沖突。也避免了長屬性查找對象的所有方法，你可以使用局部變量“緩存”它。
var i, hasOwn = Object.prototype.hasOwnProperty; for (i in man) {if (hasOwn.call(man, i)) { // 過濾console.log(i, ":", man[i]);} }嚴格來說，不使用hasOwnProperty()并不是一個錯誤。根據任務以及你對代碼的自信程度，你可以跳過它以提高些許的循環速度。但是當你對當前對象內容（和其原型鏈）不確定的時候，添加hasOwnProperty()更加保險些。
--------------------------------------------------------------------------------------------------------------------------------------------------------------
javascript中in關鍵字還有下面的作用
定義：
in操作符用來判斷某個屬性屬于某個對象，可以是對象的直接屬性，也可以是通過prototype繼承的屬性。(參見hasOwnProperty)
注意事項：
對于一般的對象屬性需要用字符串指定屬性的名稱
如： var mycar = {make: "Honda", model: "Accord", year: 1998}; "make" in mycar? // returns true "model" in mycar // returns true?
對于數組屬性需要指定數字形式的索引值來表示數組的屬性名稱（固有屬性除外，如length）。
// Arrays var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); 0 in trees??????? // returns true 3 in trees??????? // returns true 6 in trees??????? // returns false "bay" in trees??? // returns false (you must specify the index number, ????????????????? // not the value at that index) "length" in trees // returns true (length is an Array property) ?in的右邊必須是一個對象，如：你可以指定一個用String構造器生成的，但是不能指定字符串直接量的形式：
var color1 = new String("green"); "length" in color1 // returns true var color2 = "coral"; "length" in color2 // generates an error (color is not a String object) ?如果你使用delete操作符刪除了一個屬性，再次用in檢查時，會返回false，如：
var mycar = {make: "Honda", model: "Accord", year: 1998}; delete mycar.make; "make" in mycar;? // returns false ? var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); delete trees[3]; 3 in trees; // returns false?
如果你把一個屬性值設為undefined，但是沒有使用delete操作符，使用in檢查，會返回true.
var mycar = {make: "Honda", model: "Accord", year: 1998}; mycar.make = undefined; "make" in mycar;? // returns true?
var trees = new Array("redwood", "bay", "cedar", "oak", "maple"); trees[3] = undefined; 3 in trees; // returns true
1.For...In 聲明用于對數組或者對象的屬性進行循環/迭代操作。
?
對于數組?，迭代出來的是數組元?素，對于對象?，迭代出來的是對象的屬性；
Js代碼??輸出為：
?
Java代碼??對象示例： Js代碼??
當“對象”為數組時，“變量”指的是數組的“索引”；
當“對象”為對象是，“變量”指的是對象的“屬性”。
?
數組示例：
Js代碼??總結
以上是生活随笔為你收集整理的js 关键字 in 的使用方法的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： js 中对象属性的特性
- 下一篇： addEventListener 的用法