js给对象添加变量属性 & js 更改对象中的属性名 & 数组对象中每个对象添加一个字段-map用法和forEarch用法[亲测有效]

编程小6 (42) 2023-03-27 17:35

Hi，大家好，我是编程小6，很荣幸遇见你，我把这些年在开发过程中遇到的问题或想法写出来，今天说一说js给对象添加变量属性 & js 更改对象中的属性名 & 数组对象中每个对象添加一个字段-map用法和forEarch用法[亲测有效],希望能够帮助你!!!。

js给对象添加变量属性 & js 更改对象中的属性名 & 数组对象中每个对象添加一个字段-map用法和forEarch用法

1、js给对象添加变量属性

1、js创建一个对象或者在原有对象上添加一个已知属性，并给这个属性赋值，写法如下：

let obj = { 
   'a1':'a1'};
obj['a2'] = 'a2';
console.log(obj);//输出{'a1':'a1','a2':'a2'};

2、添加一个变量属性，并赋值变量，写法如下：

function add(name,value){ 
   
    let obj = { 
   "a1":"a1"};
    obj[name] = value;//返回参数
    console.log(obj);//{"a1":"a1","b1":"b1"}
}
add("b1","b1");

3、js 更改对象中的属性名

const json = JSON.parse(JSON.stringify(options).replace(/name/g,"label"));

注：

1、options是需要更改属性的对象

2、replace(/name/g,“label”) ，将对象里所有属性为name的都修改成label

2、js把数组里面的所有对象合并成一个对象

let obj = [{ 
   
         name1: '张三',
         age1: "12"
    },
    { 
   
         name2: '李四',
         age2: "14"
    },
    { 
   
         name3: '王五',
         age3: "30"
    }
]

let newObj = { 
   } // 新建一个对象

obj.forEach((item) => { 
   
    newObj = { 
   
         ...newObj,
          ...item
    } // 要把自己放进去
})
console.log(newObj) // { name1: "张三", age1: "12", name2: "李四", age2: "14", name3: "王五", age3: "30" }

3、数组对象中每个对象添加一个字段

小案例

let arr = [{ 
   
     'name': 'aa',
     'age': 10
   },
   { 
   
      'name': 'bb',
      'age': 12
   }
]
let newArr = []
    arr.map((item, index) => { 
   
    newArr.push(
        Object.assign({ 
   }, item, { 
   
             id: index
        })
    )
})


console.log(arr) // [ {'name': 'aa', 'age': 10},{'name': 'bb', 'age': 12}]
console.log(newArr)
        // [ {name: "aa", age: 10, id: 0},{name: "bb", age: 12, id: 1}]

详解

将数组对象中每一个对象添加一个字段

let arr = [
    { 
   name: 'lilei',age: '25'},
    { 
   name: 'nike',age: '23'},
    { 
   name: 'alisa',age: '23'}
]

使用Array map()方法

map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。

map()方法将调用的数组的每个元素传递给指定的函数，并返回一个数组，它包含该函数的返回值，有三个参数
1、currentValue 必须。当前元素的值
2、index 可选。当前元素的索引值
3、index 可选。当前元素属于的数组对象

let _arr = []
arr.map((item, index) => { 
   
	_arr.push(Object.assign({ 
   },item,{ 
   sex: 'men'}))
}))
// _arr返回结果
[
   { 
   name: 'lilei',age: '25',sex: 'men'},
   { 
   name: 'nike',age: '23',sex: 'men'},
   { 
   name: 'alisa',age: '23',sex: 'men'}
]

小案例

 let arr = [23, 31, 60, 88, 90, 108, 260]
        /* 1. 需求：数组中的每一个元素+1 */
        let arr1 = arr.map((value, index) => { 
   
            return value + 1 //让每个元素的值+1
        })
        console.log(arr1); //) [24, 32, 61, 89, 91, 109, 261]

        /* 2.需求：超过100的商品打八折 */
        let arr2 = arr.map((value, index) => { 
   
            if (value > 100) { 
   
                return value * 0.8

            } else { 
   
                return value;
            }
        })
        console.log('arr2', arr2); // [23, 31, 60, 88, 90, 86.4, 208]

使用Array forEach()方法

forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。
1、currentValue 必须。当前元素的值
2、index 可选。当前元素的索引值
3、index 可选。当前元素属于的数组

arr.forEach((value , index) => { 
   
	value['sex'] = 'men'
})
// 返回原数组arr
[
   { 
   name: 'lilei',age: '25',sex: 'men'},
   { 
   name: 'nike',age: '23',sex: 'men'},
   { 
   name: 'alisa',age: '23',sex: 'men'}
]

综合实例

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
</head>

<body>
    <script> let arr = [{ 
     'name': 'aa', 'age': 10 }, { 
     'name': 'bb', 'age': 12 } ] let newArr = [] arr.map((item, index) => { 
     newArr.push( Object.assign({ 
    }, item, { 
     id: index }) ) }) console.log(arr) // [ {'name': 'aa', 'age': 10},{'name': 'bb', 'age': 12}] console.log(newArr) // [ {name: "aa", age: 10, id: 0},{name: "bb", age: 12, id: 1}] let ary = [{ 
     name: 'lilei', age: '25' }, { 
     name: 'nike', age: '23' }, { 
     name: 'alisa', age: '23' } ] ary.forEach((value, index) => { 
     value['sex'] = 'men' }) console.log(ary) </script>
</body>

</html>

效果图-数组对象中添加字段

已是最后文章

已是最新文章

发表回复取消回复

请先登录账户再评论哦

js给对象添加变量属性 & js 更改对象中的属性名 & 数组对象中每个对象添加一个字段-map用法和forEarch用法[亲测有效]