2024-08-06 Javascript 使用 reduce 方法的ES5 及 ES6比較

發表於 分類於 閱讀次數：
2024-08-06 Javascript 使用 reduce 方法的ES5 及 ES6比較

2024-08-06 Javascript 使用 reduce 方法

寫法演進

.for 廻圈寫法

1
2
3
4
5
6
7
8
9
10
11
12
13
var data_pie = [
  { CO2e_percentage: 10 },
  { CO2e_percentage: 20 },
  { CO2e_percentage: 30 },
];

var totalPie = 0;
for (var i = 0; i < data_pie.length; i++) {
  totalPie += data_pie[i].CO2e_percentage;
}

console.log(totalPie); // 60

.ES5 寫法

1
2
3
4
5
6
7
8
9
10
11
var data_pie = [
  { CO2e_percentage: 10 },
  { CO2e_percentage: 20 },
  { CO2e_percentage: 30 },
];

var totalPie = data_pie.reduce(function(acc, row) {
  return acc + row.CO2e_percentage;
}, 0);

console.log(totalPie); // 60

.ES6寫法

1
2
3
4
5
6
var data_pie = [
  { CO2e_percentage: 10 },
  { CO2e_percentage: 20 },
  { CO2e_percentage: 30 },
];
const totalPie = data_pie.reduce((acc, row) => acc + row.CO2e_percentage, 0);