乡下人产国偷v产偷v自拍,国产午夜片在线观看,婷婷成人亚洲综合国产麻豆,久久综合给合久久狠狠狠9

  • <output id="e9wm2"></output>
    <s id="e9wm2"><nobr id="e9wm2"><ins id="e9wm2"></ins></nobr></s>

    • 分享

      13 種在 JavaScript 中刪除/過濾數(shù)組的方法

       風(fēng)聲之家 2021-11-13

      WEB前端開發(fā)社區(qū) 

      2021-11-13

      我們可能總是會遇到根據(jù)一個屬性或多個屬性值從數(shù)組或?qū)ο髷?shù)組中刪除項目的時候,今天讓我們看看根據(jù)屬性值從數(shù)組中刪除或過濾項目有哪些不同的方法。
      1、POP
      “pop() 方法從數(shù)組中刪除最后一個元素并返回該元素。這個方法改變了數(shù)組的長度?!?(來源:MDN)
      數(shù)組:
      let arraypoptest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];let testpop = arraypoptest.pop();console.log("array pop", testpop,"-", arraypoptest);//10 - [2, 1, 2, 5, 6, 7, 8, 9, 9];
      對象數(shù)組:
      let users1 = [{ id: 1, name: "ted" },{ id: 2, name: "mike" },{ id: 3, name: "bob" },{ id: 4, name: "sara" }];let testpop1 = users1.pop();console.log(    "array of objects pop",    JSON.stringify(testpop1),"-"    JSON.stringify(users1));//{"id":4,"name":"sara"} - [{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
      2、Shift()
      “shift() 方法從數(shù)組中移除第一個元素并返回移除的元素。這個方法改變了數(shù)組的長度?!?(來源:MDN)
      數(shù)組:
      let arrayshifttest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];let testshift = arrayshifttest.shift();console.log("array shift", testshift,"-", arrayshifttest);//2 - [1, 2, 5, 6, 7, 8, 9, 9, 10]
      對象數(shù)組:
      let users2 = [{ id: 1, name: "ted" },{ id: 2, name: "mike" },{ id: 3, name: "bob" },{ id: 4, name: "sara" }];let testshift1 = users2.shift();console.log("array of objects shift", JSON.stringify(testshift1),"-", JSON.stringify(users2));//{"id":1,"name":"ted"} - [{"id":2,"name":"mike"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}]
      3、slice
      “slice() 方法將數(shù)組的一部分的淺拷貝返回到從開始到結(jié)束(不包括結(jié)束)選擇的新數(shù)組對象中,其中開始和結(jié)束表示該數(shù)組中項目的索引。不會修改原始數(shù)組?!?(來源:MDN)
      數(shù)組:
      let arrayslicetest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];let testslice = arrayslicetest.slice(0, 3);console.log("array slice", testslice, arrayslicetest); //not changed original array//[2, 1, 2] - [2, 1, 2, 5, 6, 7, 8, 9, 9, 10]
      對象數(shù)組:
      let users3 = [{ id: 1, name: "ted" },{ id: 2, name: "mike" },{ id: 3, name: "bob" },{ id: 4, name: "sara" }];let testslice1 = users3.slice(0, 3);console.log("array of objects slice", JSON.stringify(testslice1));//not changed original array//[{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
      4、splice
      “ splice() 方法通過刪除或替換現(xiàn)有元素和/或在適當位置添加新元素來更改數(shù)組的內(nèi)容?!?(來源:MDN)
      數(shù)組:
      let arraysplicetest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];let testsplice = arrayslicetest.splice(0, 3);
      對象數(shù)組:
      let users4 = [{ id: 1, name: "ted" },{ id: 2, name: "mike" },{ id: 3, name: "bob" },{ id: 4, name: "sara" }];let testspice1 = users3.splice(0, 3);console.log("array of objects splice", JSON.stringify(testsplice));//[{"id":1,"name":"ted"},{"id":2,"name":"mike"},{"id":3,"name":"bob"}]
      5、使用 splice 刪除特定值
      數(shù)組:
      let arr = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];for (var i = 0; i < arr.length; i++) {    if (arr[i] === 5) {        arr.splice(i, 1);    }}console.log("splice with specific value", arr);//[2, 1, 2, 6, 7, 8, 9, 9, 10]
      對象數(shù)組:
      let users5 = [{ id: 1, name: "ted" },{ id: 2, name: "mike" },{ id: 3, name: "bob" },{ id: 4, name: "sara" }];for (var i = 0; i < users5.length; i++) {    if (users5[i].name === "ted") {        users5.splice(i, 1);    }}console.log("splice with specific value array of objects",JSON.stringify( users5));//[{"id":2,"name":"mike"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}]
      6、使用 splice 刪除特定值 — 簡寫
      “ splice() 方法通過刪除或替換現(xiàn)有元素,或在適當位置添加新元素來更改數(shù)組的內(nèi)容?!保▉碓矗篗DN)
      “indexOf() 方法返回可以在數(shù)組中找到給定元素的第一個索引,如果不存在,則返回 -1?!保▉碓矗篗DN)
      數(shù)組:
      let arrShorthand = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];let val = arr.indexOf(5);arrShorthand.splice(val, 1);console.log("splice shorthand specific value", arrShorthand);//[1, 2, 3, 4, 5, 6, 7, 8, 9]
      對象數(shù)組:
      let users6 = [{ id: 1, name: "ted" },{ id: 2, name: "mike" },{ id: 3, name: "bob" },{ id: 4, name: "sara" }];var removeIndex = users6.map(item => item.id).indexOf(1);users6.splice(removeIndex, 1);console.log("splice shorthand specific value array of objects", JSON.stringify(users6));//[{"id":2,"name":"mike"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}]
      7、Filter
      “filter() 方法創(chuàng)建一個新數(shù)組,其中包含所有通過所提供函數(shù)實現(xiàn)的測試的元素。”(來源:MDN)
      數(shù)組:
      let testarr = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];let testarr2 = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];let filtered = testarr.filter(function(value, index, arr) {    return value > 5;});let filtered2 = testarr2.filter(item => item !== 2);console.log("filter example 1", filtered);//[6, 7, 8, 9, 9, 10]console.log("filter example 2", filtered2);//[1, 5, 6, 7, 8, 9, 9, 10]
      刪除多個值的過濾器:
      let forDeletion = [2, 3, 5];let mularr = [1, 2, 3, 4, 5, 3];mularr = mularr.filter(item => !forDeletion.includes(item));console.log("multiple value deletion with filter", mularr);//[1, 4]
      對象數(shù)組:
      let users7 = [{ id: 1, name: "ted" },{ id: 2, name: "mike" },{ id: 3, name: "bob" },{ id: 4, name: "sara" }];let filterObj = users7.filter(item => item.id !== 2);console.log("filter example array of objects", filterObj);//[{"id":1,"name":"ted"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}]
      8、delete operator
      “JavaScript delete 操作符從對象中刪除一個屬性;如果不再持有對同一屬性的更多引用,它最終會自動釋放?!保▉碓矗篗DN)
      let ar = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];delete ar[4]; // delete element with index 4console.log(ar);//[2, 1, 2, 5, undefined, 7, 8, 9, 9, 10]
      9、lodash remove
      _remove “從數(shù)組中刪除謂詞返回真值的所有元素,并返回已刪除元素的數(shù)組。謂詞使用三個參數(shù)調(diào)用:(值、索引、數(shù)組)?!?(來源:lodash)
      數(shù)組:
      let arrlodashtest = [2, 1, 2, 5, 6, 7, 8, 9, 9, 10];let evens = _.remove(arrlodashtest, function(n) {    return n % 2 == 0;});console.log("lodash remove array", arrlodashtest);//[1, 5, 7, 9, 9]
      對象數(shù)組:
      let users8 = [{ id: 1, name: "ted" },{ id: 2, name: "mike" },{ id: 3, name: "bob" },{ id: 4, name: "sara" }];let evensObj = _.remove(users8, function(n) {    return n.id % 2 == 0;});console.log("lodash remove array of object", JSON.stringify(evensObj));//[{"id":2,"name":"mike"},{"id":4,"name":"sara"}]
      10、對象實用程序
      “Object.entries() 方法返回給定對象自己的可枚舉字符串鍵控屬性 [key, value] 對的數(shù)組,其順序與 for...in 循環(huán)提供的順序相同?!?(來源:MDN)
      const object = [1, 2, 3, 4];const valueToRemove = 3;const arrObj = Object.values(    Object.fromEntries(        Object.entries(object).filter(([key, val]) => val !== valueToRemove)    ));console.log("object utilites", arrObj); // [1,2,4]
      11、 lodash filter
      _filter “迭代集合的元素,返回所有元素的數(shù)組,謂詞返回真值。謂詞使用三個參數(shù)調(diào)用:(值、索引|鍵、集合)。” (來源:lodash)
      let users10 = [{ id: 1, name: “ted” },{ id: 2, name: “mike” },{ id: 3, name: “bob” },{ id: 4, name: “sara” }];const lodashFilter = _.filter(users10, { id: 1 });console.log(“l(fā)odash filter”, JSON.stringify(lodashFilter));//[{"id":1,"name":"ted"}]
      12、lodash without
      _without “返回過濾值的新數(shù)組?!?(來源:lodash)
      let lodashWithout = [2, 1, 2, 3];let lodashwithoutTest = _.without(lodashWithout, 1, 2);console.log(lodashwithoutTest);//[3]
      13、lodash reject 
      _reject “與 _.filter 做相反的事情,這個方法返回predicate不返回真值的集合元素?!保▉碓矗簂odash)
      let users9 = [{ id: 1, name: "ted" },{ id: 2, name: "mike" },{ id: 3, name: "bob" },{ id: 4, name: "sara" }];const result = _.reject(users9, { id: 1 });console.log("lodash reject", result);//[{"id":2,"name":"mike"},{"id":3,"name":"bob"},{"id":4,"name":"sara"}]

      總結(jié)

      以上就是我今天與你分享的內(nèi)容,如果你覺得對你有所幫助,請記得點贊,并且分享給你身邊做開發(fā)的朋友。

      英文 | https://javascript./13-methods-to-remove-filter-an-item-in-an-array-and-array-of-objects-in-javascript-f02b71206d9d
      翻譯 | 楊小愛

        本站是提供個人知識管理的網(wǎng)絡(luò)存儲空間,所有內(nèi)容均由用戶發(fā)布,不代表本站觀點。請注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購買等信息,謹防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點擊一鍵舉報。
        轉(zhuǎn)藏 分享 獻花(0

        0條評論

        發(fā)表

        請遵守用戶 評論公約

        類似文章 更多