js查找和篩選的幾種方式

find();

find() 方法返回通過測試（函數內判斷）的數組的第一個元素的值。

find() 方法為數組中的每個元素都調用一次函數執行：

當數組中的元素在測試條件時返回  true 時, find() 返回符合條件的元素，之后的值不會再調用執行函數。
如果沒有符合條件的元素返回 undefined

注意: find() 對於空數組，函數是不會執行的。

注意: find() 並沒有改變數組的原始值。

[1,2,3,4,5,6].find((n) => n < 5) //找出數組中第一個大於5 的成員 // 6 array.find(function(currentValue, index, arr),thisValue) currentValue ： 必需。當前元素 index：可選。當前元素的索引值 arr: 可選。當前元素所屬的數組對象 thisValue: 可選。 傳遞給函數的值一般用 "this" 值。 如果這個參數為空， "undefined" 會傳遞給 "this" 值

 

findIndex();

findIndex() 方法返回傳入一個測試條件（函數）符合條件的數組第一個元素位置。

findIndex() 方法為數組中的每個元素都調用一次函數執行：

當數組中的元素在測試條件時返回  true 時, findIndex() 返回符合條件的元素的索引位置，之后的值不會再調用執行函數。
如果沒有符合條件的元素返回 -1

注意: findIndex() 對於空數組，函數是不會執行的。

注意: findIndex() 並沒有改變數組的原始值。

[3,10,18,19].findIndex((n) => n >= 18) //返回符合條件的值的位置（索引） // 2 array.findIndex(function(currentValue, index, arr),thisValue) currentValue ： 必需。當前元素 index：可選。當前元素的索引值 arr: 可選。當前元素所屬的數組對象 thisValue: 可選。 傳遞給函數的值一般用 "this" 值。 如果這個參數為空， "undefined" 會傳遞給 "this" 值

 

filter();

filter() 方法創建一個新的數組，新數組中的元素是通過檢查指定數組中符合條件的所有元素。(返回數組，包含了符合條件的所有元素。如果沒有符合條件的元素則返回空數組。)

注意： filter() 不會改變原始數組。

注意： filter() 不會對空數組進行檢測。

var arr = [1,2,3,4,5,6,7]
var newArr = arr.filter(item => item > 5);
console.log(newArr); //[6, 7]
array.filter(function(currentValue, index, arr),thisValue)
currentValue ： 必需。當前元素
index：可選。當前元素的索引值
arr: 可選。當前元素所屬的數組對象
thisValue: 可選。 傳遞給函數的值一般用 "this" 值。
如果這個參數為空， "undefined" 會傳遞給 "this" 值
//數組去重
var arr = [1,2,2,3,4,4,5,6,6,7,8,8,9];
var newArr = arr.filter((x, index,self)=>self.indexOf(x) === index)  
console.log(newArr); // [1, 2, 3, 4, 5, 6, 7, 8, 9]

 

indexOf();

indexOf() 方法可返回某個指定的字符串值在字符串中首次出現的位置。

注釋：indexOf() 方法對大小寫敏感！

注釋：如果要檢索的字符串值沒有出現，則該方法返回 -1。

lastIndexOf() 方法可返回一個指定的字符串值最后出現的位置，在一個字符串中的指定位置從后向前搜索。

stringObject.indexOf(searchvalue,fromindex)該方法將從頭到尾地檢索字符串 stringObject，看它是否含有子串 searchvalue。開始檢索的位置在字符串的 fromindex 處或字符串的開頭（沒有指定 fromindex 時）。如果找到一個 searchvalue，則返回 searchvalue的第一次出現的位置。stringObject 中的字符位置是從 0 開始的。  

var str= "aaa456ac"; console.log(arr.indexOf(‘b‘)); // -1 , 字符b第一次出現的位置，沒有，返回-1； console.log(arr.indexOf(‘a‘)); // 0 , 字符a第一次出現的位置，是 0 console.log(arr.indexOf(‘a‘, 3)); // 6, 從第四個字符位置開始往后繼續查找，包含當前位置 console.log(arr.indexOf(‘ac‘, 3)); // 6, 字符串ac第一次出現的位置 console.log(arr.lastIndexOf(‘a‘)); // 6, 字符串a最后出現的位置

 

some() ；

some() 方法用於檢測數組中的元素是否滿足指定條件（函數提供）。

some() 方法會依次執行數組的每個元素：

如果有一個元素滿足條件，則表達式返回true , 剩余的元素不會再執行檢測。 
 如果沒有滿足條件的元素，則返回false。

注意： some() 不會對空數組進行檢測。

注意： some() 不會改變原始數組。

array.some(function(currentValue,index,arr),thisValue)

var arr = [1,2,3,4,5,6,7]
var isHas = arr.some(item => item > 5);
console.log(isHas ); //  true
var isHas2 = arr.some(item => item > 7);
console.log(isHas2 ); //  false

 

every() ；

every() 方法用於檢測數組所有元素是否都符合指定條件（通過函數提供）。

every() 方法使用指定函數檢測數組中的所有元素：

如果數組中檢測到有一個元素不滿足，則整個表達式返回 false ，且剩余的元素不會再進行檢測。 
如果所有元素都滿足條件，則返回 true。

注意： every() 不會對空數組進行檢測。

注意： every() 不會改變原始數組。

array.every(function(currentValue,index,arr), thisValue)

var arr = [1,2,3,4,5,6,7]
var isHas = arr.every(item => item > 5);
console.log(isHas ); //  false
var isHas2 = arr.every(item => item < 8);
console.log(isHas2 ); //  true

 

JavaScript 循環

for - 多次遍歷代碼塊

for/in - 遍歷對象屬性

while - 當指定條件為 true 時循環一段代碼塊

do/while - 當指定條件為 true 時循環一段代碼塊

for (i = 0; i < 5; i++) { text += "數字是 " + i + "<br>"; console.log(text); // 0,1,2,3,4 }

 

For/In 循環

JavaScript for/in 語句遍歷對象的屬性：

for/in 遍歷對象時， key表示對象的屬性；

var person = {fname:"Bill", lname:"Gates", age:62}; var text = "";for (var key in person) { text += person[key] + "-"; } console.log(text); // Bill-Gates-62

for/in 遍歷數組時， key表示數組的index索引；

var arr = [20,40,50]; var text = ""; for (var key in arr ) { text += arr[key] + "-"; } console.log(text); // 20-40-50

 

For/Of 循環

for of 循環是 Es6 中新增的語句，用來替代 for in 和 forEach，它允許你遍歷 Arrays（數組）, Strings（字符串）, Maps（映射）, Sets（集合）等

可迭代(Iterable data)的數據結構,注意它的兼容性。

let arr = [1,2,3]; for(let i of arr){ console.log(i) } // 1 // 2 // 3

資源搜索網站大全 https://www.renrenfan.com.cn 廣州VI設計公司https://www.houdianzi.com

forEach（）；

forEach() 方法用於調用數組的每個元素，並將元素傳遞給回調函數。

注意: forEach() 對於空數組是不會執行回調函數的。

array.forEach(function(currentValue, index, arr), thisValue)

var arr = [1,2,3,4] ; arr.forEach(function(item,index, myarr){ console.log(item); // 1 // 2 // 3 // 4 // myarr: [1,2,3,4] });

 

map();

map() 方法返回一個新數組，數組中的元素為原始數組元素調用函數處理后的值。

map() 方法按照原始數組元素順序依次處理元素。

注意： map() 不會對空數組進行檢測。

注意： map() 不會改變原始數組。

array.map(function(currentValue,index,arr), thisValue)

var numbers = [4, 9, 7, 5]; var newArr= numbers .map(function (item) { //接收新數組 return item * 2; }); console.log(newArr); // [8, 18, 14, 10];