前端-解构赋值语法

// 用于存储最终结果的对象
let finalData = {};

// 遍历 allData 数组
allData.forEach((item) => {
  const { sales_code, next_month_prediction_quantity, ...rest } = item;
  // 如果 finalData 中已存在当前销售码的数据,则进行合并操作
  if (finalData[sales_code]) {
    finalData[sales_code].next_month_prediction_quantity += parseFloat(next_month_prediction_quantity);
  } else {
    // 如果 finalData 中不存在当前销售码的数据,则将当前数据添加到 finalData 中
    finalData[sales_code] = { ...rest, next_month_prediction_quantity: parseFloat(next_month_prediction_quantity) };
  }
});
console.log(finalData); // 这里输出 finalData 对象,其中包含了合并后的结果

===>const { sales_code, next_month_prediction_quantity, …rest } = item;

代码使用了解构赋值语法。它的作用是从对象 item 中提取属性 sales_codenext_month_prediction_quantity 的值,并将剩余的属性以及对应的值收集到名为 rest 的对象中。

具体来说:

  • sales_code 变量存储了对象 itemsales_code 属性的值。
  • next_month_prediction_quantity 变量存储了对象 itemnext_month_prediction_quantity 属性的值。
  • rest 对象包含了除 sales_codenext_month_prediction_quantity 外的所有属性及其对应的值。

这种方法让你可以轻松获取指定属性的值,并使用 rest 对象来存储其他属性的值,使得代码更为简洁清晰。

  • 8
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ES6是ECMAScript6的简称,也叫做ES2015,是JavaScript的一种新的标准。它引入了许多新的语法特性和API,提高了JavaScript开发效率和代码质量。下面是ES6的一些常用语法特性及简单案例: 1. 块级作用域声明 ES6中引入了let和const关键字,用于声明块级作用域的变量和常量。在块级作用域内声明的变量和常量只在该作用域内有效。 ```javascript { let x = 1; // 声明块级作用域变量 const y = 2; // 声明块级作用域常量 } console.log(x); // 报错,x未定义 console.log(y); // 报错,y未定义 ``` 2. 箭头函数 ES6中引入了箭头函数,用于简化函数的定义。箭头函数没有自己的this和arguments,它的this和外层作用域的this是一样的。 ```javascript const sum = (a, b) => a + b; // 箭头函数的简单用法 console.log(sum(1, 2)); // 3 const person = { name: 'Tom', age: 18, sayHi: function() { console.log(`Hi, my name is ${this.name}, I'm ${this.age} years old.`); }, sayHiArrow: () => { console.log(`Hi, my name is ${this.name}, I'm ${this.age} years old.`); // 报错,this未定义 } }; person.sayHi(); // Hi, my name is Tom, I'm 18 years old. person.sayHiArrow(); // 报错,this未定义 ``` 3. 模板字符串 ES6中引入了模板字符串,用于更方便地拼接字符串。模板字符串使用反引号(`)包裹,可以在其中使用变量和表达式,用${}包裹。 ```javascript const name = 'Tom'; const age = 18; console.log(`My name is ${name}, I'm ${age} years old.`); // My name is Tom, I'm 18 years old. ``` 4. 解构赋值 ES6中引入了解构赋值,用于更方便地从数组或对象中取值。解构赋值使用{}和[]包裹,用于匹配数组或对象的结构。 ```javascript const arr = [1, 2, 3]; const [a, b, c] = arr; // 解构赋值 console.log(a, b, c); // 1 2 3 const person = { name: 'Tom', age: 18 }; const {name, age} = person; // 解构赋值 console.log(name, age); // Tom 18 ``` 5. 扩展运算符 ES6中引入了扩展运算符,用于将数组或对象展开为多个参数。扩展运算符使用三个点(...)表示。 ```javascript const arr1 = [1, 2, 3]; const arr2 = [4, 5, 6]; const arr3 = [...arr1, ...arr2]; // 扩展运算符 console.log(arr3); // [1, 2, 3, 4, 5, 6] const person1 = { name: 'Tom', age: 18 }; const person2 = { ...person1, // 扩展运算符 address: 'Beijing' }; console.log(person2); // {name: "Tom", age: 18, address: "Beijing"} ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值