码农知识堂 - 1000bd
  •   Python
  •   PHP
  •   JS/TS
  •   JAVA
  •   C/C++
  •   C#
  •   GO
  •   Kotlin
  •   Swift
  • Vue、jquery和angular之间区别


    aVue、jquery、angular之间区别

    • angular与jquery区别
    • angular和Vue

    angular与jquery区别

    三个版本的输入数据绑定,都是单页面应用。
    Angular

    	<body ng-app>
    		<input type="text" ng-model="name">
    		<p>{{name}}</p>
    	</body>
    <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
    
    • 1
    • 2
    • 3
    • 4
    • 5

    jquery

    <body>
    	<input type="text">
    	<p></p>
    </body>
    <script src="jquery-3.3.1.js"></script>
    <script>
    	$(function(){
    		$('input').keyup(function(){
    			let value=this.value;
    			console.log(value)
    			$('p').html(value)
    		})
    	})
    </script>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14

    Vue.js

    </head>
    <body>
    <div id="app">
    	<input type="text" v-model="message">
      <p>{{ message }}</p>
    </div>
    
    <script>
    new Vue({
      el: '#app',
      data: {
        message: 'Vue.js!'
      }
    })
    </script>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15

    显而易见的是,拥有双向数据绑定的angular用更轻量的代码做了相同的事。
    1.从理论来看,jquery在创建之初了为了解决前端在浏览器之中的样式兼容性问题,它是一个js库,而angular是一种前端框架,前者是用于调用库来更便捷的写代码,后者是写代码在这个框架中,在它所创造的体系中进行实际的应用。
    2.jquery不支持双向数据绑定,angular&Vue支持。
    3.jquery的API大多数需要和DOM联系,而angular较少的使用DOM,避免了一定的重排重绘问题。
    4.jquery应用于单页面程序开发,angular既适用于单页面开发,也被使用在app、云平台等多个整体应用中。
    5.jquery主要用$+DOM进行协同开发,angular有一套自定义指令来进行使用,如ngIf ngFor ngModel等等。
    6.与node&typescript结合的angular有着更强大的初始化项目能力,能够快速利用命令行创建初始项目。

    angular和Vue

    这两个都是双向数据绑定。不同的是
    1.核心库与生态:Vue核心库较小,生态较新,angular核心库较大,生态较稳定。前者较易学习,后者相对较难。
    2。双向绑定:Vue基于ES5中的getter/setter,angular基于它原生的模板编译规则和脏检查
    缺点:
    Vue:对IE9以下浏览器不支持,但性能较angular高效。
    Angular:作用域有变化时,所有监听都需要重新被脏检查,监听越多angular越慢,脏检查循环需要执行多次。而解决这个问题对于前端来说并不容易。
    3.指令不同:angular:ng-x Vue:v-x
    4.angular由google维护,Vue由个人维护。
    5.通信:Vue为了让通信数据流更清晰易懂,在不同组件间通信强制使用单向数据绑定,Angular双向数据绑定。

  • 相关阅读:
    Zookeeper ACL机制中ProviderRegistry的设计缺陷
    Sqlserver关于tempdb临时数据库文件个数的最佳实践
    看完这6款浏览器的对比,你还使用国产浏览器吗
    【MySQL进阶】表的增删改查操作(CRUD)+(SQL执行顺序)
    预约洗车/美容/维修/家政/保养/上门洗车预约小程序源码及管理系统
    从积木式到装配式云原生安全
    Vue CLI的Runtime + Compiler和Runtime-only选项的区别和render渲染机制原理解析
    leetcode 1710. Maximum Units on a Truck(卡车上最大的units)
    vue3第二十三节(全局属性方法应用)
    【rust/esp32】初识slint ui框架并在st7789 lcd上显示
  • 原文地址:https://blog.csdn.net/lplovewjm/article/details/134075228
  • 最新文章
  • 攻防演习之三天拿下官网站群
    数据安全治理学习——前期安全规划和安全管理体系建设
    企业安全 | 企业内一次钓鱼演练准备过程
    内网渗透测试 | Kerberos协议及其部分攻击手法
    0day的产生 | 不懂代码的"代码审计"
    安装scrcpy-client模块av模块异常,环境问题解决方案
    leetcode hot100【LeetCode 279. 完全平方数】java实现
    OpenWrt下安装Mosquitto
    AnatoMask论文汇总
    【AI日记】24.11.01 LangChain、openai api和github copilot
  • 热门文章
  • 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!
    奉劝各位学弟学妹们,该打造你的技术影响力了!
    五年了,我在 CSDN 的两个一百万。
    Java俄罗斯方块,老程序员花了一个周末,连接中学年代!
    面试官都震惊,你这网络基础可以啊!
    你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法
    心情不好的时候,用 Python 画棵樱花树送给自己吧
    通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!
    13 万字 C 语言从入门到精通保姆级教程2021 年版
    10行代码集2000张美女图,Python爬虫120例,再上征途
Copyright © 2022 侵权请联系2656653265@qq.com    京ICP备2022015340号-1
正则表达式工具 cron表达式工具 密码生成工具

京公网安备 11010502049817号