01-hello_vue与声明式编程

第一个vue代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>hello_vue</title>
    <script src="../js/vue.js"></script>
</head>
<body>
<div id="app">{
    
    {
    
    message}}</div>
</body>
<script>
const app = new Vue({
    
    
    el: '#app',
    data: {
    
    
        message: 'hello Vue'
    }
})
</script>
</html>

运行结果:在这里插入图片描述

声明式编程

命令式编程(Imperative):详细的命令机器怎么(How)去处理一件事情以达到你想要的结果(What);
声明式编程( Declarative):只告诉你想要的结果(What),机器自己摸索过程(How)

命令式编程(imperative):详细描述路径
下个路口左转
下个有红灯的路口右转
前进100米
在下个路口掉头
前进1500米
到达王府井大街出租车停车区

声明式编程(Declarative):只告诉目的地
带我到王府井大街。

两者之间各有自己的优缺点,以打车为例子命令式编程(imperative)会给出详细的路线,这样做的问题就是如果出租车司机自己知道一条更加优化的路线或者导航软件知道前方的交通状况提供了其他路线,但是在命令式编程(imperative)的情况下就司机只能无条件执行用户命令而无法做出改变。

当你面临在两者之间做出选择使用谁时,最关键的是你需要想明白,是否需要给程序详细的命令。

两者具体区别参照

响应式

在chrom开发工具中进行如下操作:
在这里插入图片描述
仅仅改变了数据内容,并没有执行其它操作,网页自动返回了修改后的结果

猜你喜欢

转载自blog.csdn.net/plan_jok/article/details/112850709