1. <strong id="7actg"></strong>
    2. <table id="7actg"></table>

    3. <address id="7actg"></address>
      <address id="7actg"></address>
      1. <object id="7actg"><tt id="7actg"></tt></object>

        面試官問:indexOf 和 findIndex 的區(qū)別

        共 4547字,需瀏覽 10分鐘

         ·

        2021-04-12 12:53


        indexOffindIndex 都是查找數(shù)組中滿足條件的第一個元素的索引

        indexOf

        Array.prototype.indexOf():

        indexOf() 方法返回在數(shù)組中可以找到一個給定元素的第一個索引,如果不存在,則返回-1。

        來自:MDN

        例如:

        const sisters = ['a''b''c''d''e'];
        console.log(sisters.indexOf('b'));
        // 1

        請注意:indexOf() 使用嚴格等號(與 === 或 triple-equals 使用的方法相同)來比較 searchElement 和數(shù)組中的元素

        所以,indexOf 更多的是用于查找基本類型,如果是對象類型,則是判斷是否是同一個對象的引用

        let sisters = [{a1}, {b2}];
        console.log(sisters.indexOf({b2}));
        // -1

        const an = {b2}
        sisters = [{a1}, an];
        console.log(sisters.indexOf(an));
        // 1

        findIndex

        Array.prototype.findIndex():

        findIndex()方法返回數(shù)組中滿足提供的測試函數(shù)的第一個元素的索引。若沒有找到對應元素則返回-1。

        來自:MDN

        const sisters = [109121516];
        const isLargeNumber = (element) => element > 13;
        console.log(sisters.findIndex(isLargeNumber));
        // 3

        findIndex 期望回調(diào)函數(shù)作為第一個參數(shù)。如果你需要非基本類型數(shù)組(例如對象)的索引,或者你的查找條件比一個值更復雜,可以使用這個方法。

        indexOf 與 findIndex 區(qū)別(總結)

        • indexOf :查找值作為第一個參數(shù),采用 === 比較,更多的是用于查找基本類型,如果是對象類型,則是判斷是否是同一個對象的引用

        • findIndex :比較函數(shù)作為第一個參數(shù),多用于非基本類型(例如對象)的數(shù)組索引查找,或查找條件很復雜

        源碼實現(xiàn)(加深)

        indexOf

        if (!Array.prototype.indexOf) {
          Array.prototype.indexOf = function(searchElement, fromIndex{

            var k;
            if (this == null) {
              throw new TypeError('"this" is null or not defined');
            }

            var O = Object(this);
            var len = O.length >>> 0;
            if (len === 0) {
              return -1;
            }

            var n = +fromIndex || 0;
            if (Math.abs(n) === Infinity) {
              n = 0;
            }
            if (n >= len) {
              return -1;
            }
            k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);

            while (k < len) {
              if (k in O && O[k] === searchElement) { // === 匹配
                return k;
              }
              k++;
            }
            return -1;
          };
        }

        findIndex

        if (!Array.prototype.findIndex) {
          Object.defineProperty(Array.prototype, 'findIndex', {
            valuefunction(predicate{
              if (this == null) {
                throw new TypeError('"this" is null or not defined');
              }

              var o = Object(this);
              var len = o.length >>> 0;

              if (typeof predicate !== 'function') {
                throw new TypeError('predicate must be a function');
              }

              var thisArg = arguments[1];

              var k = 0;
              while (k < len) {
                var kValue = o[k];
                if (predicate.call(thisArg, kValue, k, o)) { // 比較函數(shù)判斷
                  return k; 
                }
                k++;
              }

              return -1;
            }
          });
        }

        來源:https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/451

        瀏覽 42
        點贊
        評論
        收藏
        分享

        手機掃一掃分享

        分享
        舉報
        評論
        圖片
        表情
        推薦
        點贊
        評論
        收藏
        分享

        手機掃一掃分享

        分享
        舉報
        1. <strong id="7actg"></strong>
        2. <table id="7actg"></table>

        3. <address id="7actg"></address>
          <address id="7actg"></address>
          1. <object id="7actg"><tt id="7actg"></tt></object>
            欧美操bbb | 婷婷五月天激情综合网 | 豆花成人视频 | 国产免费永久视频 | 性Av播放 | 国产成人操欧美屄熟 | 日本WWW在线视频 | 中文字幕综合一区 | 红桃视频乱码一区二区三区 | 宝贝胸罩脱了让我揉你的胸视频 |