js数组对象中查找id为1的对象的name属性
时间: 2024-03-12 15:43:53 浏览: 20
假设数组对象为arr,可以使用以下代码查找id为1的对象的name属性:
```
let obj = arr.find(item => item.id === 1);
let name = obj.name;
```
或者使用以下代码:
```
let name = arr.find(item => item.id === 1).name;
```
相关问题
js查找数组对象中的值
你可以使用 JavaScript 的 `Array.prototype.find()` 方法来查找数组对象中的值。这个方法接受一个函数作为参数,这个函数用来判断数组中的每个元素是否符合要求。如果符合要求,`find()` 方法就会返回该元素,否则返回 `undefined`。
例如,假设你有一个数组对象,其中每个元素都有一个 `id` 属性,你想要查找 `id` 为 2 的元素,你可以这样写:
```javascript
const arr = [
{ id: 1, name: 'Alice' },
{ id: 2, name: 'Bob' },
{ id: 3, name: 'Charlie' }
];
const result = arr.find(item => item.id === 2);
console.log(result); // { id: 2, name: 'Bob' }
```
这个例子中,`find()` 方法会依次遍历数组中的每个元素,将其传递给函数 `item => item.id === 2` 进行判断。当判断条件 `item.id === 2` 成立时,`find()` 方法就会返回该元素,即 `{ id: 2, name: 'Bob' }`。如果数组中没有符合条件的元素,`find()` 方法就会返回 `undefined`。
Vue在数组对象中查找值并取出
在Vue中,可以使用`Array.prototype.find()`方法来查找数组中符合条件的对象,并取出该对象的值。与上面Javascript的方法类似,不同的是在Vue中通常会将数据存储在组件的`data`属性中,因此需要使用`this`关键字来获取数组对象。假设在Vue组件中有一个数组对象`list`,其中包含多个对象,每个对象有多个属性,可以使用以下方式来查找符合条件的对象,并取出该对象的值:
```
<template>
<div>
<ul>
<li v-for="item in list" :key="item.id">{{ item.name }} - {{ item.age }}</li>
</ul>
<p>{{ name }}</p>
</div>
</template>
<script>
export default {
data() {
return {
list: [
{ id: 1, name: "张三", age: 18 },
{ id: 2, name: "李四", age: 20 },
{ id: 3, name: "王五", age: 22 }
],
name: ""
}
},
mounted() {
// 查找年龄为20的对象,并取出该对象的姓名
var item = this.list.find(function(item) {
return item.age === 20;
});
this.name = item.name;
}
}
</script>
```
在上面的代码中,我们将数组对象`list`存储在组件的`data`属性中,使用`v-for`指令遍历数组对象并在页面中显示出来。在`mounted()`生命周期钩子中,使用`this.list.find()`方法查找年龄为20的对象,并将该对象赋值给变量`item`,最后使用`this.name`将该对象的`name`属性的值赋值给组件的`name`属性,用于在页面中显示出来。