关于JavaScript在对象{}内部定义函数的几种方式(ES6的极简之美)
关于JavaScript在对象{}内部定义函数的几种方式(ES6的极简之美)
最近初学Vue.js,对JavaScript中函数、对象的运用方式颇受启发,先看以下代码:
HTML:
<div id="counter">Counter: {{ counter }}
</div>
JS:
const Counter = {data() {return {counter: 0}},mounted() {setInterval(() => {this.counter++}, 1000)}}Vue.createApp(Counter).mount('#counter')
话不多说,其实es6规范指定了对象{}内部的字面量定义可以省略function,也就是说,上面代码等价于:
const Counter = {data: function() {return {counter: data.num}},mounted: function() {setInterval(() => {this.counter++}, 1000)}}Vue.createApp(Counter).mount('#counter')