zoukankan      html  css  js  c++  java
  • Vue 数组封装和组件data定义为函数一些猜测

     数组封装

    var vm={
        list:[0,1]
    }
    var push=vm.list.push;//把数组原来的方法存起来
    vm.list.push=function(arg){//重新定义数组的push方法
        push.call(this,arg);//调用老的push方法
        console.log('数组增加项');//执行其他相关的程序
    }
    

       这里实际上新的push方法应该是放在__proto__里,上面这么写是方便理解

      上面我定义了一个简单的push方法,在数组初始化的时候 用新定义的方法代替了数组原有方法,从而实现对数组操作的封装

    组件data定义

    var component1={
         data:{
           name:'test'
        }
    }
    var component2={
         data:function(){
           name:'test'
        }
    }
    
    var vm1.xxx=component1.data;//引用
    var vm2.xxx=component1.data();//复制
    

      组件的data一般是不能引用的,因为一个页面可能有好几个改类型的组件

      定义为函数,可以更方面每个组件的data初始化

      最近在使用Vue,在使用的过程中,慢慢对Vue的设计原理有了一些猜想,这个系列的文章就是阐述这些猜想,这些猜想并不是阅读源码的结果,纯粹是使用过程中的猜测,这个系列的文章会陆续更新,主要是用来和大家讨论Vue的实现。要研究Vue的实现,并不是每个人都适合直接看源码的,只是我不太适合直接看源码,我还是喜欢用了后,自己先在脑海里里YY一下,能都YY的差不多了,再去对照源码验证自己的猜想:)

      

  • 相关阅读:
    js 时间相关函数
    javascript面向对象:继承、多态
    面向对象相关
    reset.css css重置公共样式
    开通博客园第一天。
    vue 和 react 路由跳转和传参
    前端密码加密方式
    react组件回顶部
    移动端使用rem方法
    用rekit创建react项目
  • 原文地址:https://www.cnblogs.com/blowfish/p/9572703.html
Copyright © 2011-2022 走看看