theSum() { return this.checkNumArr.reduce((sum, val) => { return (sum += val); }, 0); }, },不一样的写法
时间: 2024-01-28 22:05:55 浏览: 24
这段代码是一个对象的方法,可以使用不同的写法来实现相同的功能。下面是一个等效的写法,仅供参考:
```
function theSum() {
let sum = 0;
for (let i = 0; i < this.checkNumArr.length; i++) {
sum += this.checkNumArr[i];
}
return sum;
}
const obj = {
checkNumArr: [1, 2, 3],
theSum: theSum,
};
console.log(obj.theSum()); // 输出 6
```
这里使用了一个名为 `theSum()` 的函数来计算数组元素的和,然后将这个函数赋给了对象 `obj` 的属性 `theSum`。在这个函数中,使用了一个 `for` 循环遍历了数组元素,并将其累加到 `sum` 变量中,最后返回了 `sum` 的值。
使用这种写法的好处是可以更清晰地表达代码的意图,避免使用箭头函数时可能出现的混淆。
相关问题
解读一下 computed: { isAllChecked: { set(val) { this.shopcarList.forEach((ele) => { ele.isChecked = val; }); }, get() { return this.shopcarList.every((ele) => ele.isChecked); }, }, priceTotal() { let sum = 0; let newPrice = this.shopcarList.filter((ele) => { return ele.isChecked == true; }); sum = newPrice.reduce((pre, current) => { return (pre += current.price * current.num); }, 0); return sum * 100; }, }, };
这也是一段Vue.js的代码片段,其中使用了computed计算属性来实现一些功能,具体解释如下:
isAllChecked:该计算属性包含了set和get两个方法。set方法用于设置购物车中所有商品的选中状态,即将isChecked属性设置为传入的val值。get方法检查购物车中所有商品的选中状态,如果所有商品都被选中,则返回true,否则返回false。
priceTotal:该计算属性用于计算购物车商品的总价。首先定义了一个sum变量,然后使用filter方法从shopcarList数组中过滤出所有选中的商品,将它们的价格和数量相乘得到小计,最后使用reduce方法将所有小计相加得到总价。由于计算属性的结果是以分为单位的整数,所以最后将总价乘以100返回。
这段代码怎么优化export default { data() { return { stepper: 1, shopcarList: [], }; }, methods: { onSubmit() { console.log(111); }, add(index) { // console.log(index); this.$set( this.shopcarList[index], this.shopcarList[index].num, this.shopcarList[index].num++ ); }, del(index) { if (this.shopcarList[index].num == 1) { this.$toast("不能再减了"); } else { this.$set( this.shopcarList[index], this.shopcarList[index].num, this.shopcarList[index].num-- ); } }, }, created() { this.shopcarList = JSON.parse(localStorage.getItem("shopcar")) || []; console.log(this.shopcarList); }, computed: { isAllChecked: { set(val) { this.shopcarList.forEach((ele) => { ele.isChecked = val; }); }, get() { return this.shopcarList.every((ele) => { return ele.isChecked == true; }); }, }, priceTotal() { let sum = 0; let newPrice = this.shopcarList.filter((ele) => { return ele.isChecked == true; }); sum = newPrice.reduce((pre, current) => { return (pre += current.price * current.num); }, 0); return sum * 100; }, }, }; </script>
这段代码可以进行以下优化:
1. 将 `methods` 中的 `add` 和 `del` 方法中的 `$set` 改为直接修改属性值,例如 `this.shopcarList[index].num++` 和 `this.shopcarList[index].num--`。
2. 在 `computed` 中的 `priceTotal` 方法中,可以使用 `filter` 和 `reduce` 方法的链式调用,将其简化为一行代码。
优化后的代码如下:
```
export default {
data() {
return {
stepper: 1,
shopcarList: [],
};
},
methods: {
onSubmit() {
console.log(111);
},
add(index) {
this.shopcarList[index].num++;
},
del(index) {
if (this.shopcarList[index].num == 1) {
this.$toast("不能再减了");
} else {
this.shopcarList[index].num--;
}
},
},
created() {
this.shopcarList = JSON.parse(localStorage.getItem("shopcar")) || [];
console.log(this.shopcarList);
},
computed: {
isAllChecked: {
set(val) {
this.shopcarList.forEach((ele) => {
ele.isChecked = val;
});
},
get() {
return this.shopcarList.every((ele) => ele.isChecked);
},
},
priceTotal() {
return this.shopcarList.filter((ele) => ele.isChecked)
.reduce((pre, current) => pre += current.price * current.num, 0) * 100;
},
},
};
```
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)