javascript中for/in循環(huán)及使用技巧
JavaScript 支持不同類型的循環(huán):
for - 循環(huán)代碼塊一定的次數(shù)
for/in - 循環(huán)遍歷對(duì)象的屬性
while - 當(dāng)指定的條件為 true 時(shí)循環(huán)指定的代碼塊
do/while - 同樣當(dāng)指定的條件為 true 時(shí)循環(huán)指定的代碼塊
1. in運(yùn)算符:要求其左邊的運(yùn)算數(shù)是一個(gè)字符串,或可以被轉(zhuǎn)換為字符串,右邊的運(yùn)算數(shù)是一個(gè)對(duì)象或數(shù)組。如果該運(yùn)算符左邊的值是右邊對(duì)象的一個(gè)屬性名,則返回true。
例如:
var point={x:1,y:2}; //對(duì)象直接量
var has_x="x" in point; //返回true
var has_z="z" in point; //返回false
var ts="toString" in point;//返回true,toString為繼承方法
2. for/in語句:語法,
for (variable in object)
statement;
提供了一種遍歷對(duì)象屬性的方法。
例:
for(var prop in my_object) {
document.write("name:"+prop+";value:"+my_object[prop],"<br>");
}
javascript的數(shù)組是一種特殊的對(duì)象,因此for/in循環(huán)可以像枚舉對(duì)象屬性一樣枚舉數(shù)組下標(biāo)。
可以把一個(gè)對(duì)象的所有屬性名復(fù)制到一個(gè)數(shù)組中,
例:
var o= {x:1,y:2,z:3};
var a=new Array();
var i=0;
for (a[i++] in o)
;//空語句,用于初始化數(shù)組
3. in運(yùn)算符與for/in語句不同,for/in語句in的左邊可以是聲明一個(gè)變量的var語句,數(shù)組的一個(gè)元素或者是對(duì)象的一個(gè)屬性,不能使字符串。
4. 數(shù)組常用的存取屬性運(yùn)算符是“[]”,而不是“.”。使用“[]”來命名屬性名師字符串值,是動(dòng)態(tài)的,可以在運(yùn)行時(shí)改變,而不是一個(gè)標(biāo)識(shí)符“.”。
例:
var stock_name= get_stock_name_from_user();//從用戶處獲取股票名
var share= get_number_of_shares();//得到股票數(shù)量
portfolio[stock_name]= share;//動(dòng)態(tài)地創(chuàng)建數(shù)組股票,并為每支股票賦值
將該例子與for/in循環(huán)一起使用,當(dāng)用戶輸入了他的投資組合,可以計(jì)算當(dāng)前總值
var value= 0;
for (stock in portfolio) {
value +=get_share_value(stock)*portfolio[stock];
}
stock存取的是每支股票的名字。
portfolio[stock]存取的是每支股票的數(shù)量。
for-in循環(huán)
功能:遍歷對(duì)象屬性,把屬性名和屬性值都提出來
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]);
}
}
EnumaKey(obj)
//key1 key2 key3
EnumaVal(obj)
//value1 value2 value3
數(shù)組也可以這樣遍歷,但不推薦,因?yàn)椴荒鼙WC順序,而且如果在Array的原型上添加了屬性,這個(gè)屬性也會(huì)被遍歷出來。
for-in循環(huán)應(yīng)該用在非數(shù)組對(duì)象的遍歷上,使用for-in進(jìn)行循環(huán)也被稱為“枚舉”。
從技術(shù)上將,你可以使用for-in循環(huán)數(shù)組(因?yàn)镴avaScript中數(shù)組也是對(duì)象),但這是不推薦的。因?yàn)槿绻麛?shù)組對(duì)象已被自定義的功能增強(qiáng),就可能發(fā)生邏輯錯(cuò)誤。另外,在for-in中,屬性列表的順序(序列)是不能保證的。所以最好數(shù)組使用正常的for循環(huán),對(duì)象使用for-in循環(huán)。
- JavaScript使用類似break機(jī)制中斷forEach循環(huán)的方法
- 詳談js中標(biāo)準(zhǔn)for循環(huán)與foreach(for in)的區(qū)別
- Javascript數(shù)組循環(huán)遍歷之forEach詳解
- 全面解析JavaScript里的循環(huán)方法之forEach,for-in,for-of
- js的for in循環(huán)和java里foreach循環(huán)的區(qū)別分析
- javascript forEach通用循環(huán)遍歷方法
- JS數(shù)組的遍歷方式for循環(huán)與for...in
- javascript 循環(huán)語句 while、do-while、for-in、for用法區(qū)別
- JavaScript中for..in循環(huán)陷阱介紹
- js中forEach,for in,for of循環(huán)的用法示例小結(jié)
相關(guān)文章
微信小程序?qū)崿F(xiàn)跑馬燈效果完整代碼(附效果圖)
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)跑馬燈效果完整代碼(附效果圖),小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-05-05
js從數(shù)組中刪除指定值(不是指定位置)的元素實(shí)現(xiàn)代碼
下面小編就為大家?guī)硪黄猨s從數(shù)組中刪除指定值(不是指定位置)的元素實(shí)現(xiàn)代碼。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-09-09
異步動(dòng)態(tài)加載JS并運(yùn)行(示例代碼)
這篇文章主要是對(duì)異步動(dòng)態(tài)加載JS并運(yùn)行的示例代碼進(jìn)行了介紹。需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-12-12
深入理解JavaScript系列(10) JavaScript核心(晉級(jí)高手必讀篇)
本篇是ECMA-262-3 in detail系列的一個(gè)概述(本人后續(xù)會(huì)翻譯整理這些文章到本系列(第11-19章)。每個(gè)章節(jié)都有一個(gè)更詳細(xì)的內(nèi)容鏈接,你可以繼續(xù)讀一下每個(gè)章節(jié)對(duì)應(yīng)的詳細(xì)內(nèi)容鏈接進(jìn)行更深入的了解2012-01-01
JS實(shí)現(xiàn)點(diǎn)擊循環(huán)切換顯示內(nèi)容的方法
這篇文章主要介紹了JS實(shí)現(xiàn)點(diǎn)擊循環(huán)切換顯示內(nèi)容的方法,涉及javascript鼠標(biāo)事件響應(yīng)及頁面元素的獲取、屬性設(shè)置等相關(guān)操作技巧,需要的朋友可以參考下2017-10-10
微信小程序?qū)崿F(xiàn)拍照和相冊(cè)選取圖片
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)拍照和相冊(cè)選取圖片,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-05-05
uni-app中實(shí)現(xiàn)元素拖動(dòng)效果
這篇文章主要介紹了uni-app中實(shí)現(xiàn)元素拖動(dòng)效果,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2024-01-01
JavaScript實(shí)現(xiàn)新年倒計(jì)時(shí)效果
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)新年倒計(jì)時(shí)效果,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-11-11

