js中遍歷的示例分析

這篇文章將為大家詳細講解有關js中遍歷的示例分析，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

forEach

es5出來的方法，這是我在react中用的最多的遍歷方法之一，用法如下：

models.forEach(model => app.model(model));

dva里面經常這么寫。

寫法很簡單，經常用于通過這個數組內的數據創造新的結構，但是forEach的問題在于它不能跳出循環。

map

也是用的最多的方法之一，用法如下

{data.map(d => (
     <div className="balance-row">
      <div className="balance-col currency">{d.currency.toUpperCase()}</div>
      <div className="balance-col balance">
       <div>
        <FormattedNumber value={d.balance} />
       </div>
       <div className="light-text lock">
        <i className="icon anticon icon-lock" /><FormattedNumber value={d.locked} />
       </div>
      </div>
     </div>
    ))}

react 里面經常這么寫。

const value = [1, 22, 4, 5].map(d => d + 1);
value; // [2, 23, 5, 6]

用于改變一個數組內容，相當于改變了原數組

for ... in

for (let prop in obj) {
 if (obj.hasOwnProperty(prop)) {
  // 繼續操作prop和obj
 }
}

for ... in也可以用于遍歷數組，但是不推薦

for ... of

ES6中加了一個新的遍歷方式，主要是用來彌補forEach 和 for...in的短板，它還可以遍歷字符串、map對象、set對象、generator對象。

注意：它只能遍歷帶有iterable屬性的對象，所以不能遍歷對象，除非刻意給object加上一個iterable屬性。
這個老厲害了！

Map

let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);
 
for (let [key, value] of iterable) {
 console.log(value);
}
// 1
// 2
// 3
 
for (let key of iterable) {
 console.log(key);
}
// [a, 1]
// [b, 2]
// [c, 3]

Set

let iterable = new Set([1, 1, 2, 2, 3, 3]);
 
for (let value of iterable) {
 console.log(value);
}
// 1
// 2
// 3

Generator

function * fibonacci() { // a generator function
 let [prev, curr] = [0, 1];
 while (true) {
  [prev, curr] = [curr, prev + curr];
  yield curr;
 }
}
 
for (let n of fibonacci()) {
 console.log(n);
 // truncate the sequence at 1000
 if (n >= 1000) {
  break;
 }
}

關于“js中遍歷的示例分析”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。