一、查詢數(shù)組中，某一項中的某個數(shù)據(jù)為指定值的項（find() 方法）

使用分析

• 使用數(shù)組的 find() 方法來查詢 id 為 0 的那一項數(shù)據(jù)。這個方法會返回滿足條件的第一個元素，如果找不到符合條件的元素，則返回 undefined。
• 使用 find() 方法傳入一個回調(diào)函數(shù)作為參數(shù)?；卣{(diào)函數(shù)接收一個參數(shù) item，表示數(shù)組中的每個元素。我們在回調(diào)函數(shù)中判斷 item.id === 0 來查找 id 為 0 的那一項數(shù)據(jù)。

效果展示

這里查詢id為1的那一項的數(shù)據(jù)信息

核心代碼

const item = array.find(item => item.id === 1);

完整代碼

<template><view></view>
</template>
<script>export default {data() {return {}},methods: {},onLoad() {const array =[{id:0,name:'張三',age:18},{id:1,name:'李四',age:28},{id:2,name:'王五',age:38},{id:3,name:'趙六',age:48}]	console.log('初始數(shù)組');console.log(array);//查詢數(shù)組中指定id值的具體項（這里指定id為1） console.log('查詢id為1的那一項數(shù)據(jù)');const item = array.find(item => item.id === 1);console.log(item);}};
</script>
<style></style>

二、查詢數(shù)組中，某一項中的某個數(shù)據(jù)為指定值的項，存在多項數(shù)據(jù)的情況（filter() 方法）

?使用分析

• 使用數(shù)組的 filter() 方法。filter() 方法會返回一個新數(shù)組
• 使用 filter() 方法傳入一個回調(diào)函數(shù)作為參數(shù)。回調(diào)函數(shù)接收一個參數(shù) item，表示數(shù)組中的每個元素。我們在回調(diào)函數(shù)中判斷 item.name === '張三' 來篩選出 name 為 "張三" 的所有項。

效果展示

這里查詢name為‘張三’的全部項的數(shù)據(jù)信息

核心代碼

const items = array.filter(item => item.name === '張三');

完整代碼

<template><view></view>
</template>
<script>export default {data() {return {}},methods: {},onLoad() {const array = [{id: 0,name: '張三',age: 18},{id: 1,name: '李四',age: 28},{id: 2,name: '王五',age: 38},{id: 3,name: '張三',age: 48}];console.log('初始數(shù)組');console.log(array);console.log('查詢name為‘張三’的全部項');const items = array.filter(item => item.name === '張三');console.log(items);}};
</script>
<style></style>

注：find（）和 filter（）,前者只返回滿足條件的第一個的元素，而不是所有，后者即返回全部滿足條件的數(shù)據(jù)

三、查詢數(shù)組中，某一項中的某個數(shù)據(jù)為指定值時，對應該項中其他值的信息

方法一：使用循環(huán)遍歷數(shù)組進行查詢

使用分析

通過for循序對數(shù)組進行遍歷，array[i].id即為每一項中的id值

效果展示

這里查詢id為2時，該項的name值

核心代碼

let name = '';
?? ??? ??? ?for (let i = 0; i < array.length; i++) {
?? ??? ??? ??? ?if (array[i].id === 2) {
?? ??? ??? ??? ??? ?name = array[i].name;
?? ??? ??? ??? ??? ?break;
?? ??? ??? ??? ?}
?? ??? ??? ?}

完整代碼

<template><view></view>
</template>
<script>export default {data() {return {}},methods: {},onLoad() {const array = [{id: 0,name: '張三',age: 18},{id: 1,name: '李四',age: 28},{id: 2,name: '王五',age: 38},{id: 3,name: '張三',age: 48}];console.log('初始數(shù)組');console.log(array);console.log('查詢id為2的項中的name值');let name = '';for (let i = 0; i < array.length; i++) {if (array[i].id === 2) {name = array[i].name;break;}}console.log(name);}};
</script>
<style></style>

方法二：使用find()方法和三目運算進行配合

?使用分析

• find() 方法返回第一個滿足條件的元素，而不是所有。如果沒有任何元素滿足條件，則返回 undefined
• 如果find()方法查詢到了數(shù)據(jù)，通過三目運算進行輸出

效果展示

這里查詢id為2時，該項的name值

核心代碼

const item = array.find(item => item.id === 2);
const name = item ? item.name : '';

完整代碼

<template><view></view>
</template>
<script>export default {data() {return {}},methods: {},onLoad() {const array = [{id: 0,name: '張三',age: 18},{id: 1,name: '李四',age: 28},{id: 2,name: '王五',age: 38},{id: 3,name: '張三',age: 48}];console.log('初始數(shù)組');console.log(array);console.log('查詢id為2的項中的name值');const item = array.find(item => item.id === 2);//三目運算，如果item的值存在說明找到了對應的數(shù)據(jù)就輸出值，如果不是就輸出空值const name = item ? item.name : '';console.log(name);}};
</script>
<style></style>

四、判斷數(shù)組中，是否存在有一項中某個數(shù)據(jù)為指定值的項

??使用分析

• 數(shù)組的 some() 方法來判斷是否存在滿足條件的元素。some() 方法會遍歷數(shù)組中的每一個元素，如果其中任意一個元素返回 true，則 some() 方法的返回值為 true；如果所有元素都返回 false，則 some() 方法的返回值為 false。
• 使用 some() 方法傳入一個回調(diào)函數(shù)作為參數(shù)?；卣{(diào)函數(shù)接收一個參數(shù) item，表示數(shù)組中的每個元素。我們在回調(diào)函數(shù)中判斷 item.name === '李四' 來查找 name 屬性等于 "李四" 的元素。如果找到了匹配的項，則將 hasItem 設置為 true；否則設置為 false。

效果展示

這里判斷name中是否含有‘李四’和‘王麻子’

核心代碼

const hasItem = array.some(item => item.name === '李四');

if (hasItem) {
????????console.log('數(shù)組中存在 name 值為 "李四" 的數(shù)據(jù)');
} else {
????????console.log('數(shù)組中不存在 name 值為 "李四" 的數(shù)據(jù)');
}

完整代碼

<template><view></view>
</template>
<script>export default {data() {return {}},methods: {},onLoad() {const array = [{id: 0,name: '張三',age: 18},{id: 1,name: '李四',age: 28},{id: 2,name: '王五',age: 38},{id: 3,name: '趙六',age: 48}];console.log("初始數(shù)組")console.log(array)//判斷是否有name為'李四'的數(shù)據(jù)const hasItem = array.some(item => item.name === '李四');if (hasItem) {console.log('數(shù)組中存在 name 值為 "李四" 的數(shù)據(jù)');} else {console.log('數(shù)組中不存在 name 值為 "李四" 的數(shù)據(jù)');}//判斷是否有name為'王麻子'的數(shù)據(jù)const hasItem1 = array.some(item => item.name === '王麻子');if (hasItem1) {console.log('數(shù)組中存在 name 值為 "王麻子" 的數(shù)據(jù)');} else {console.log('數(shù)組中不存在 name 值為 "王麻子" 的數(shù)據(jù)');}}};
</script>
<style></style>

五、修改數(shù)組中某一項中的某個值為指定值時，該項對應別的數(shù)據(jù)的值

???使用分析

• 使用 find() 方法傳入一個回調(diào)函數(shù)作為參數(shù)?；卣{(diào)函數(shù)接收一個參數(shù) item，表示數(shù)組中的每個元素。我們在回調(diào)函數(shù)中判斷 item.id === 2 來查找 id 屬性等于 2 的元素。如果找到了匹配的項，則將對應的 age 值修改為 55，并輸出修改后的數(shù)組；否則輸出“數(shù)組中不存在 id 值為 2 的元素”。

效果展示

這里修改id為2對應的age值

原始數(shù)據(jù)

修改后數(shù)據(jù)

核心代碼

const item = array.find(item => item.id === 2);
if (item) {
????????item.age = 55;
? ? ? ? console.log('修改成功，新的數(shù)組數(shù)據(jù)為：', array);
} else {
? ? ? ? console.log('數(shù)組中不存在 id 值為 2 的元素');
}

完整代碼

<template><view></view>
</template>
<script>export default {data() {return {}},methods: {},onLoad() {const array = [{id: 0,name: '張三',age: 18},{id: 1,name: '李四',age: 28},{id: 2,name: '王五',age: 38},{id: 3,name: '趙六',age: 48}];		const item = array.find(item => item.id === 2);if (item) {item.age = 55;console.log('修改成功，新的數(shù)組數(shù)據(jù)為：', array);} else {console.log('數(shù)組中不存在 id 值為 2 的元素');}}};
</script>
<style></style>