1. 程式人生 > >javascript中for迴圈的幾種寫法與總結

javascript中for迴圈的幾種寫法與總結

如果您希望一遍又一遍地執行相同的程式碼,並且每次的值都不同,那麼使用迴圈是很方便的。迭代語句又叫迴圈語句。
JavaScript 支援不同型別的迴圈:

  1. for - 迴圈程式碼塊一定的次數
  2. for/in - 迴圈遍歷物件的屬性
  3. while - 當指定的條件為 true 時迴圈指定的程式碼塊
  4. while -do 當指定的條件為 true 時迴圈指定的程式碼塊
  5. forEach() 方法用於呼叫陣列的每個元素,並將元素傳遞給回撥函式。
  6. jquery ().each,.each;

    1.for迴圈的一般寫法為:

for (語句 1; 語句 2; 語句 3)
  {
  被執行的程式碼塊
  }
語句 1
在迴圈(程式碼塊)開始前執行。一般用於初始化迴圈中所用的變數 語句 2 定義執行迴圈(程式碼塊)的條件.位於2ge逗號之間。如果語句 2 返回 true,則迴圈再次開始,如果返回 false,則迴圈將結束。 語句 3 在迴圈(程式碼塊)已被執行之後執行
我們來看一個例子
var a 
for(var i = 0;i< arr.length;i++) {  a = arr[i]; //... }
就是一個常見的,正序迴圈的for迴圈。這樣寫的缺點大家都明白:每次都從arr裡取length與i來對比,浪費效能(而且,要是arr的長度是動態變化的,就會出現死迴圈)。改進這個迴圈的辦法是用變數儲存arr.length:
var
a for(var i=0,b=arr.length;i<b;i++){a = arr[i]; } 當然這也也不是最簡單的我們可以利用for迴圈中的語句2.2當語句2為假時。終止迴圈。語句2為假的情況就有(空字串,0nullundefined).當語句2為這些情況時就會終止迴圈。即上面的程式碼可以改為 for(var i = 0, a;a = arr[i++];) { //... }注意這裡只有一個=號,所以這不是判斷句,是賦值語句,就是把arr[i++]賦給a,然後判斷a是不是真值。只說當i++已經超過陣列的長度時,迴圈肯定要停止才行,而這裡真的就停止了,為什麼?因為a=arr[i++] ,如果取到了超出陣列本身長度的項,只會取得一個undefined,而undefined是假值,迴圈條件就判斷失敗了。
當然這也寫還是有弊端的當語句2的條件如當a為(空字串,0nullundefined)中任意一個值時都會終止迴圈。所以還是根據實際情況來。 **2.for/in - 迴圈遍歷物件的屬性** 一般的格式為 for (屬性 in 物件) { txt=txt + person[x]; } 如 var person={fname:"John",lname:"Doe",age:25}; for (x in person) { //在此執行程式碼 txt=txt + person[x];//person[x]分別為John,Doe,25 //x分別為fname,lname,age } **1.不按順序輸出** 值得注意的是它不會按照下標的輸出,執行時按chrome執行,先把當中的非負整數鍵提出來,排序好輸出,然後將剩下的定義時的順序輸出。如: "first":"first", "zoo":"zoo", "2":"2", "34":"34", "1":"1", "second":"second" }; for (var i in obj) { console.log(i); }; 輸出: 1 2 34 first zoo second 2.for in迴圈的物件是原型。如下面3個例子: 例子一:function getNewArray(){ var array=[1,2,3,4,5]; Array.prototype.age=13; var result = []; for(var i=0;i<array.length;i++){ result.push(array[i]); } alert(result.join('')); } 例子二: function getArrayTwo(){ var array=[1,2,3,4,5 ]; var result=[]; for(var i in array){ result.push(array[i]); } alert(result.join('')); } 例子三: function getNewArrayTwo(){ var array=[1,2,3,4,5 ]; Array.prototype.age=13; var result=[]; for(var i in array){ result.push(array[i]); } alert(result.join('')); } 例子四: function finalArray(){ var array=[1,2,3,4,5 ]; Array.prototype.age=13; var result=[]; for(var i in array){ if(array.hasOwnProperty(i)){ result.push(array[i]); } } alert(result.join('')); } 例子一二四的結果是12345。而例子三的結果是1234513.建議不要對陣列執行for in迴圈,事實上,在高效能javascript這本書中,也強調了for in迴圈的不好,因為它總是會訪問該物件的原型,看下原型上是否有屬性,這在無意中就給遍歷增加了額外的壓力。例子四是利用如果某個物件具有給定名稱的屬性,那麼Object.prototype.hasOwnProperty(name)返回true。如果該物件是從原型鏈中繼承了該屬性,或者根本沒有這樣的一個屬性,則返回false。通過hasOwnProperty限定for in迴圈在當前中遍歷,而不用去考慮它的原型屬性。

3. while - 當指定的條件為 true 時迴圈指定的程式碼塊
一般寫法為:
while (條件)
{
需要執行的程式碼//當條件為真時執行裡面的程式碼。一旦為假時跳出迴圈
}
4. while -do 當指定的條件為 true 時迴圈指定的程式碼塊
一般寫法為do
{
需要執行的程式碼
}
while (條件);
跟while不一樣的是while -do至少執行一次。應該它是先執行再判斷 的;

當然2個相同的是別忘了給他們範圍。否則他會一直迴圈下去的。進入死迴圈。在結合使用break語句用於跳出迴圈,跳出迴圈後如果下面還有程式碼則繼續執行。continue語句則會跳過這一次迴圈直接進行下一次。

  1. forEach() 方法用於呼叫陣列的每個元素,並將元素傳重點內容遞給回撥函式。
    注意:forEach() 對於空陣列是不會執行回撥函式的。僅支援ie9+
    一般寫法為:
    array.forEach(function(currentValue, index, arr), thisValue)
    1. currentValue 必需項。為當前元素。
    2. index可選。當前元素的索引值。
    3. arr 可選。當前元素所屬的陣列物件。thisValue 可選。傳遞給函式的值一般用 “this” 值。
      4.如果這個引數為空, “undefined” 會傳遞給 “this” 值
      舉例說明如下:
var data=[1,2,3,4,5,6];
var sum=0;
data.forEach(function(v){//其中的v就是陣列的值 123456
sum+=v;})
document.write(sum+"<br>");//打印出來是21
data.forEach(function(o,p,q){//分別對應:陣列元素,元素的索引,陣列本身
 q[p]=o+1;
})
document.write(data);

注意:forEach無法在所有元素都傳遞給呼叫的函式之前終止(而for迴圈卻有break方法),如果要提前終止,必須把forEach放在try塊中,並能丟擲一個異常。如果forEach()呼叫的函式丟擲foreach.break異常,迴圈會提前終止:

function foreach(a,b,c){
 try{
  a.forEach(b,c);
}catch(e){
  if(e===foreach.break)return;
 else throw e;
}
}
foreach.break=new Error("StopIteration");

}

6. jquery ().each,.each;
6.1().each().each 在dom處理上面用的較多。如果頁面有多個input標籤型別為checkbox,對於這時用$().each來處理多個checkbook,例如:

$(“input[name=’ch’]”).each(function(i){
if($(this).attr(‘checked’)==true)
{
//一些操作程式碼
}
回撥函式是可以傳遞引數,i就為遍歷的索引。

遍歷一個數組通常用$.each()來處理 如:

$.each([{name:"limeng",email:"xfjylimeng"},{name:"hehe",email:"xfjylimeng"}],function(i,n)
{
alert("索引:"+i+"對應值為:"+n.name);
});

引數i為遍歷索引值,n為當前的遍歷物件.


var arr1 = [ "one", "two", "three", "four", "five" ];
$.each(arr1, function(){
alert(this);
});
輸出:one   two  three  four   five

var arr2 = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]
$.each(arr2, function(i, item){
alert(item[0]);
});
輸出:1   4   7

var obj = { one:1, two:2, three:3, four:4, five:5 };
$.each(obj, function(key, val) {
alert(obj[key]);
});
輸出:1   2  3  4  5

好了就寫到這裡了。後面會不斷完善的

相關推薦

javascriptfor迴圈寫法總結

如果您希望一遍又一遍地執行相同的程式碼,並且每次的值都不同,那麼使用迴圈是很方便的。迭代語句又叫迴圈語句。 JavaScript 支援不同型別的迴圈: for - 迴圈程式碼塊一定的次數 for/in - 迴圈遍歷物件的屬性 while - 當指定

JavaScriptfor迴圈寫法效率總結

前言 對於for迴圈,相信大家再常用不過了。但是這回說下for迴圈是因為看程式碼時我居然沒有看明白一個for迴圈的意思,真是不應該啊。 這個for迴圈是這麼寫的: ? 1 2 3 for (var i = 0, rule;

javaScript常見的報錯類型

變量類型 最大 tro 堆棧 malformed {} 原因 s函數 舉例 一般我們運行代碼的時候,在控制臺報錯會相應的顯示你錯誤的行數,找到那一行,查找你相應的錯誤 1、xxx is not defined xxx 沒有定義 2、xxx is

javaScript陣列的常用方法

1.splice(2,3,4)刪除陣列中任意項(三個引數). 2.splice(1,3)刪除從第一項開始的往後三項(兩個引數).(splice可以結合pop(),unshift(),push(),shift()來理解) 3.push()在陣列的末尾增加一項. 4.unshift()在陣列

踩坑:javascriptfor迴圈,變數不是Number型別導致for迴圈不執行

情景:從html獲取4對{起點元素(id記為start)和終點元素(id記為end)},遍歷起點到終點的所有元素,並打印出元素id(假設id連續)解決方案:Number(待轉換數)進行強制轉換js程式碼:控制檯:如上圖控制檯:第一對兒元素{43,46},進入for迴圈正常列印

JavaScriptfor迴圈,while迴圈,do......while迴圈

一.for迴圈 for迴圈語法結構: for(迴圈條件初始化;迴圈條件判斷;迴圈迭代){ 迴圈體; } 執行規則: 第一步:迴圈條件的初始化 var i=0; 只在最開始執行一次 第二步:迴圈條件判斷 i<5; 若判斷條件結果為真:則執行迴圈體 若不成立: 結束迴圈;

robot framework for迴圈方式

1、普通for迴圈 2、巢狀for迴圈 infor 3、for - in range 迴圈 普通for- in range for - in range +start-end-step (step-2未截圖出來) 由10開始遞減到2,幅度為2 4、for - in enum

kockout.js的viewmodel物件的屬性,在javascript呼叫的兩寫法

第一種:  <div>計數:<span data-bind="text: countNumber"></span></div> <button type="submit" data-bind="click: addCou

shell指令碼檔案for迴圈的兩寫法

#!/bin/bash for (( i = 0; i <= 10; i++ )) ; do echo "The value is: $i" done echo -e "\nJourneys end in lovers' meeting."

Javascript迴圈刪除陣列元素的方法示例

發現問題 大家在碼程式碼的過程中,經常會遇到在迴圈中移除指定元素的需求。按照常規的思路,直接一個for迴圈,然後在迴圈裡面來個if判斷,在判斷中刪除掉指定元素即可。但是實際情況往往不會像預想的那樣順利執行。 下面以一段Javascript程式碼為例演示這一過程。

Shellfor迴圈個常用寫法

 第一類:數字性迴圈 -----------------------------for1-1.sh #!/bin/bash for((i=1;i<=10;i++)); do echo $(expr $i \* 3 + 1); done ------------

shell裡for迴圈寫法

背景:for迴圈是常用的語法結構,shell裡的for迴圈與其它語言有些差別,這裡提供3個模板,以1~50的累加為例指令碼內容如下:#!/bin/bash#test.shell#1.列表for迴圈{}中可以是一個listsum=0for i in {1..50}do     

JAVA for迴圈寫法和效率

String[] stringS = {"A","B","C","D"}; Collection stringlists = java.util.Arrays.asList(stringS); for(int i = 0;i < stringS.length;i ++){

Java迭代列表資料時迴圈寫法的效率比較

Java中經常會用到迭代列表資料的情況,本文針對幾種常用的寫法進行效率比較。雖然網上已經有了類似的文章,但是對他們的結論並不認同。 常見的實現方法: 1.for迴圈: for(int i = 0; i < list.size(); i++) for(int i =

Java for迴圈寫法

J2SE 1.5提供了另一種形式的for迴圈。藉助這種形式的for迴圈,可以用更簡單地方式來遍歷陣列和Collection等型別的物件。本文介紹使用這種迴圈的具體方式,說明如何自行定義能被這樣遍歷的類,並解釋和這一機制的一些常見問題。 在Java程式中,要“逐

JAVA for迴圈寫法

J2SE 1.5提供了另一種形式的for迴圈。藉助這種形式的for迴圈,可以用更簡單地方式來遍歷陣列和Collection等型別的物件。本文介紹使用這種迴圈的具體方式,說明如何自行定義能被這樣遍歷的類,並解釋和這一機制的一些常見問題。 在Java程式中,要“逐一處理”――或者說,“遍歷”――某一個數組或

a標籤呼叫javascript方法的方法window.open()

我們常用的在a標籤中有點選事件: 1. a href="javascript:js_method();" 這是我們平臺上常用的方法,但是這種方法在傳遞this等引數的時候很容易出問題,而且javascript:協議作為a的href屬性的時候不僅會導致不必要的觸發window

mybaties,模糊查詢的寫法

uil 字符串 csdn clip data boa 大小寫 用法 .net 模糊查詢: 工作中用到,寫三種用法吧,第四種為大小寫匹配查詢 1. sql中字符串拼接 SELECT * FROM tableName WHERE name LIKE CONCAT(CO

Vueapp實例對象的寫法

返回值 text vue urn PE fault 共享 div 練習 1.傳統方法(練習 小DEMO中用的這種) <script type="text/ecmascript"> var app=new Vue({

java的for循環的寫法

控制結構 byte[] 操作 strings 賦值 容易 出錯 說明 最新版 J2SE 1.5提供了另一種形式的for循環。借助這種形式的for循環,可以用更簡單地方式來遍歷數組和Collection等類型的對象。本文介紹使用這種循環的具體方式,說明如何自行定義能被這樣遍歷