JavaScript中json數(shù)組查找數(shù)據(jù)的幾種方式(含模糊查找)
在 JavaScript 中,有幾種常見的方式可以用來(lái)查找 JSON 數(shù)組中的數(shù)據(jù)。
下面介紹了其中的幾種方式:
1、使用 find() 方法: find() 方法用于在數(shù)組中查找滿足指定條件的第一個(gè)元素,并返回該元素。它接受一個(gè)回調(diào)函數(shù)作為參數(shù),該回調(diào)函數(shù)會(huì)對(duì)數(shù)組中的每個(gè)元素進(jìn)行執(zhí)行,如果回調(diào)函數(shù)返回 true,則返回該元素,否則返回 undefined。
var jsonArray = [
{ id: 1, name: 'John' },
{ id: 2, name: 'Jane' },
{ id: 3, name: 'Alice' }
];
var result = jsonArray.find(function(item) {
return item.id === 2;
});
console.log(result); // { id: 2, name: 'Jane' }2.使用 filter() 方法: filter() 方法用于在數(shù)組中查找滿足指定條件的所有元素,并返回一個(gè)包含符合條件的元素的新數(shù)組。它也接受一個(gè)回調(diào)函數(shù)作為參數(shù),并在回調(diào)函數(shù)返回 true 時(shí)將當(dāng)前元素添加到結(jié)果數(shù)組中。
var jsonArray = [
{ id: 1, name: 'John' },
{ id: 2, name: 'Jane' },
{ id: 3, name: 'Alice' }
];
var result = jsonArray.filter(function(item) {
return item.name.includes('a');
});
console.log(result); // [{ id: 2, name: 'Jane' }, { id: 3, name: 'Alice' }]3.使用 forEach() 方法或普通的 for 循環(huán): 你可以使用 forEach() 方法或普通的 for 循環(huán)遍歷數(shù)組,并通過條件判斷來(lái)找到匹配的元素。
使用 forEach() 方法的示例:
var jsonArray = [
{ id: 1, name: 'John' },
{ id: 2, name: 'Jane' },
{ id: 3, name: 'Alice' }
];
var result;
jsonArray.forEach(function(item) {
if (item.name === 'Jane') {
result = item;
}
});
console.log(result); // { id: 2, name: 'Jane' }4.使用 for 循環(huán)的示例:
var jsonArray = [
{ id: 1, name: 'John' },
{ id: 2, name: 'Jane' },
{ id: 3, name: 'Alice' }
];
var result;
for (var i = 0; i < jsonArray.length; i++) {
if (jsonArray[i].name === 'Jane') {
result = jsonArray[i];
break;
}
}
console.log(result); // { id: 2, name: 'Jane' }這些方法都提供了不同的靈活性和適用場(chǎng)景。你可以根據(jù)具體的需求選擇最適合的方式來(lái)查找 JSON 數(shù)組中的數(shù)據(jù)。
總結(jié)
到此這篇關(guān)于JavaScript中json數(shù)組查找數(shù)據(jù)的幾種方式的文章就介紹到這了,更多相關(guān)json數(shù)組查找數(shù)據(jù)方式內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript常用對(duì)象的方法和屬性小結(jié)
JavaScript是基于對(duì)象的語(yǔ)言。我們知道,對(duì)象是由一組數(shù)據(jù)(JavaScript中稱之為屬性)和施加在這組數(shù)據(jù)上的方法組成的。JavaScript中還有一些不屬于任何對(duì)象的系統(tǒng)函數(shù)2012-01-01
javascript中callee與caller的用法和應(yīng)用場(chǎng)景
javascript中callee和caller的用法和應(yīng)用場(chǎng)景分析,需要的朋友可以參考下。2010-12-12
JavaScript進(jìn)階教程之非extends的組合繼承詳解
組合繼承有時(shí)候也叫偽經(jīng)典繼承,指的是將原型鏈和借用構(gòu)造函數(shù)技術(shù)組合到一塊,從而發(fā)揮二者之長(zhǎng)的一種繼承模式,下面這篇文章主要給大家介紹了關(guān)于JavaScript進(jìn)階教程之非extends的組合繼承的相關(guān)資料,需要的朋友可以參考下2022-08-08
JS+CSS實(shí)現(xiàn)的藍(lán)色table選項(xiàng)卡效果
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)的藍(lán)色table選項(xiàng)卡效果,通過鼠標(biāo)事件調(diào)用自定義函數(shù)實(shí)現(xiàn)頁(yè)面元素樣式的遍歷與動(dòng)態(tài)切換效果,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-10-10
mysql輸出數(shù)據(jù)賦給js變量報(bào)unterminated string literal錯(cuò)誤原因
mysql 數(shù)據(jù)庫(kù)數(shù)據(jù)賦給js變量報(bào)unterminated string literal錯(cuò)誤原因2010-05-05
js判斷一個(gè)元素是否為另一個(gè)元素的子元素的代碼
用js判斷一個(gè)元素是否為另一個(gè)元素的子元素,再做一些效果的時(shí)候經(jīng)常用到,特別是和鼠標(biāo)事件相關(guān)的應(yīng)用中,比如一個(gè)浮層,在鼠標(biāo)操作浮層內(nèi)元素的時(shí)候浮層顯示,當(dāng)點(diǎn)擊浮層外的元素的時(shí)候隱藏浮層2012-03-03
JavaScript導(dǎo)航腳本判斷當(dāng)前導(dǎo)航
這篇文章主要介紹了JavaScript導(dǎo)航腳本判斷當(dāng)前導(dǎo)航的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-07-07

