分类 JavaScript 下的文章

computed区别于methods的两个核心

  • computed是属性访问,而methods是函数调用
  • computed带有缓存功能,而methods不是

示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>浅析Vue中computed与method的区别</title>
    <script type="text/javascript" src="js/vue.js"></script>
</head>
<body>
<div id="app">
    <h1>{{message}}</h1>
    <p class="test1">{{methodTest}}</p>
    <p class="test2-1">{{methodTest()}}</p>
    <p class="test2-2">{{methodTest()}}</p>
    <p class="test2-3">{{methodTest()}}</p>
    <p class="test3-1">{{computedTest}}</p>
    <p class="test3-2">{{computedTest}}</p>
</div>
<!--script部分-->
<script>
    let vm = new Vue({
        el: '#app',
        data: {
            message: '我是消息,'
        },
        methods: {
            methodTest() {
                return this.message + '现在我用的是methods'
            }
        },
        computed: {
            computedTest() {
                return this.message + '现在我用的是computed'
            }
        }
    })
</script>
</body>
</html>

在很多语言中都有sleep(),delay()等这样的函数,让程序能延迟或等待一段时间再执行。JavaScriptsetTimeout()方法来实现设定一段时间后执行某个任务

function createQuote(quote, callback){ 
  var myQuote = "Like I always say, " + quote;
  callback(myQuote); // 2
}

function logQuote(quote){
  console.log(quote);
}

createQuote("eat your vegetables!", logQuote); // 1

// Result in console: 
// Like I always say, eat your vegetables!