天天看點

JavaScript 周遊方法總結 forEach some every filter map includes

 1、forEach

 傳回值 1 數組的資訊 2 數組的下标索引 沒有辦法終止循環 但是可以根據情況抛出一個錯誤 具體方法如下:

var arr = ['abc', 'bcd', 'cde']

    arr.forEach(function(element, index) {
        console.log(element);
        console.log(index);
    });
           

實作原理

Array.prototype.myforEach = function(fn) {
        for (var i = 0; i < this.length; i++) {
            fn(this[i], i)
        };
    }
    arr.myforEach(function(element, index) {
        console.log(element);
        console.log(index);
    });
           

2、some

根據一個條件驗證數組中是佛有該元素 true false 如果函數的傳回值為true那麼停止周遊 some的傳回值為true 如果知道周遊結果結束都沒有條件為true那麼傳回false

var arr = ['abc', 'bcd', 'cde']
           
var bool = arr.some(function(element,index) {
        console.log(index);
        return element === 'abc'
    })
    console.log(bool)
           

3、every

驗證數組的所有是否滿足一個條件 傳回的值也是true和false

var arr = ['abc', 'bcd', 'cde']
     var rets = arr.every(function (element,index) {
        return element.length === 3
     })
     console.log(rets);
           

4、find

找到數組中符合條件的第一個元素 和find方法一樣

var user = [
        {name:'張三',age:15},
        {name:'張三',age:16},
        {name:'張三',age:12},
        {name:'張三',age:12},
        {name:'張三',age:11},
        {name:'張三',age:19}
     ]
     var result = user.find(function (element,index) {
        return element.age >= 15
     })
     console.log(result);
           

5、findIndex

找到數組中符合條件的第一個元素的下标

var user = [
        {name:'張三',age:15},
        {name:'張三',age:16},
        {name:'張三',age:12},
        {name:'張三',age:12},
        {name:'張三',age:11},
        {name:'張三',age:19}
     ]
     var results = user.findIndex(function (element,index) {
        return element.age >= 15
     })
     console.log(results);
           

6、filter

找到所有符合條件的元素然後放到一個數組中 如果沒有符合條件的那麼傳回空數組

var user = [
          {name:'張三',age:15},
          {name:'張三',age:16},
          {name:'張三',age:12},
          {name:'張三',age:12},
          {name:'張三',age:11},
          {name:'張三',age:19}
       ]
      var sameAge = user.filter(function(element,index) {
          return element.age >= 15
      });

      console.log(sameAge);
           

7、map

對所有的元素進行操作 

//值類型
      var arr2 = [1,2,3,4]
      var After = arr2.map(function (element,index) {
        return ++element
      })
      console.log(After)


           
// 複雜資料類型
      var user = [
          {name:'張三',age:15},
          {name:'張三',age:16},
          {name:'張三',age:12},
          {name:'張三',age:12},
          {name:'張三',age:11},
          {name:'張三',age:19}
       ]
      var age = user.map(function (element,index) {
       element.age++
       return element
      })
      console.log(age);
      console.log(user);
           
    // 這時候原來的user和現在的user是一樣的 如果想要不影響原來的user那麼就需要
    // 進行深拷貝  extend方法
           

8、includes

var  arr3 = [1,3,4,1,5]
      var has = arr3.includes(3)
      console.log(has)

      // user.includes({name:'張三',age:11})  這樣是不可以的
      // 比較的是引用而不是具體的值
      var zs = user[2]
      var have = user.includes(zs)
      console.log(have);
           

以上就是JavaScript中周遊的方法,還有一個reduce 我微網誌裡也談到了 如果有什麼異議的地方 請多批評指教 

繼續閱讀