面试题vue双向绑定原理_vue路由面试题

面试题vue双向绑定原理_vue路由面试题引言:vue的双向绑定原理简单来说就是:vue内部使用object.defineProperty方法给所有数据加上getter和setter方法,在数据发生改变时发布消息给订阅者Watcher,触发响应的监听回调。object.defineProperty是JS里一个重要的方法,vue的双向绑定ES6里一些方法都是靠它实现的。如图所示zuoerobject.defineProperty…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE稳定放心使用

引言:vue的双向绑定原理简单来说就是:vue内部使用object.defineProperty方法给所有数据加上getter和setter方法,在数据发生改变时发布消息给订阅者Watcher,触发响应的监听回调。
object .defineProperty是JS里一个重要的方法,vue的双向绑定ES6里一些方法都是靠它实现的。

在这里插入图片描述

如图所示zuoerobject .defineProperty 方法给对象的属性动态加上setter和getter方法,外部获取和设置对象属性值时都会触发对应的getter,setter方法。
object .defineProperty 方法需要一个中间变量来作为返回值,否则的话set方法中直接给对象的属性设置值会无限的触发set方法陷入死循环。
vue就是在data对象中使用 object .defineProperty 方法,遍历属性给每一个属性设置setter和getter方法。每个组件实例都会对应一个Watcher实例,当setter方法触发时都会通知Watcher,从而重新渲染关联组件。这就是vue双向绑定的原理。注意object .defineProperty是ES5独有特性,这也是vue不支持IE8以及更低版本的原因。
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/180827.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • MATLAB矩阵合并「建议收藏」

    MATLAB矩阵合并「建议收藏」两个或多个矩阵的拼接(合并)操作:学习链接用[]做拼接时,有三种连接符:逗号(,),空格,分号(;)。逗号(,)和空格等价,表示不换行,直接横向拼接,横向拼接要求两个矩阵行数相同;分号(;)表示换行后纵向拼接,纵向拼接要求两个拼接的矩阵的列数相同。代码展示:1.横向拼接:1%逗号和空格表示横向拼接2A=zeros(4,2)3B=ones(4,1)4C=[AB]A=00000000B=11

    2022年6月25日
    120
  • 代理模式proxy_反向代理是什么

    代理模式proxy_反向代理是什么代理模式 Proxy动机模式定义实例结构要点总结笔记动机在面向对象系统中,由于某种原因(比如对象创建的开销很大,或者某些操作需要安全控制,或者需要进程额外的访问等),直接访问会给使用者,或者系统结构带来很多麻烦.如何在不是去透明操作对象的同时来管理/控制这些对象特有的复杂性?增加一层间接曾是软件开发中常见的解决方式模式定义为其他对象提供一种代理以控制(隔离,使用接口)对这个对象的访问实例朴素客户端要去使用process 但是process周围需要做很多事情class ISubject{p

    2022年8月9日
    9
  • Mac激活idea【2021免费激活】

    (Mac激活idea)本文适用于JetBrains家族所有ide,包括IntelliJidea,phpstorm,webstorm,pycharm,datagrip等。IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.net/100143.html…

    2022年3月29日
    315
  • java map()_java之map的基本介绍

    java map()_java之map的基本介绍map简介在讲解Map排序之前,我们先来稍微了解下map。map是键值对的集合接口,它的实现类主要包括:HashMap,TreeMap,Hashtable以及LinkedHashMap等。其中这四者的区别如下(简单介绍):HashMap我们最常用的Map,它根据key的HashCode值来存储数据,根据key可以直接获取它的Value,同时它具有很快的访问速度。HashMap最多只允许一条记录的…

    2022年7月7日
    28
  • jpg和jpeg的区别是什么_jpeg和jpg的区别是什么

    jpg和jpeg的区别是什么_jpeg和jpg的区别是什么jpg与jpeg的区别在哪

    2022年8月1日
    7
  • 自制头像生成器_dc动漫头像女

    自制头像生成器_dc动漫头像女tensorflow训练流程整合,DC_GAN原型机

    2022年8月1日
    19

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号