vue.js源码学习分享(二)

/**
 * Check if value is primitive//检查该值是否是个原始值
 */
function isPrimitive (value) {
  return typeof value === ‘string‘ || typeof value === ‘number‘
}

/**
 * Create a cached version of a pure function.//创建一个纯粹的函数的缓存版本
 */
function cached (fn) {
  var cache = Object.create(null);//创建一个缓存对象
  return (function cachedFn (str) {//返回一个函数
    var hit = cache[str];//以函数的参数为键
    return hit || (cache[str] = fn(str))//如果缓存对象中存在这个键,那么就从缓存中返回这个函数,如果没有就把这个函数赋值到缓存对象中并且返回
  })
}

/**
 * Camelize a hyphen-delimited string.//驼峰化一个连字符连接的字符串
 */
var camelizeRE = /-(\w)/g;
var camelize = cached(function (str) {
  return str.replace(camelizeRE, function (_, c) { return c ? c.toUpperCase() : ‘‘; })
});

/**
 * Capitalize a string.//对一个字符串首字母大写
 */
var capitalize = cached(function (str) {
  return str.charAt(0).toUpperCase() + str.slice(1)//把第一个字符串的首个字符大写,把除第一个字符的字符串返回与大写的首字符拼接
});

/**
 * Hyphenate a camelCase string.用字符号连接一个驼峰的字符串
 */
var hyphenateRE = /([^-])([A-Z])/g;
var hyphenate = cached(function (str) {
  return str
    .replace(hyphenateRE, ‘$1-$2‘)//$1为正则表达式匹配的第一个元素$2为第二个元素
    .replace(hyphenateRE, ‘$1-$2‘)
    .toLowerCase()//使之最小化
});

/**
 * Simple bind, faster than native//简单的绑定,会比原生的更快
 */
function bind (fn, ctx) {
  function boundFn (a) {
    var l = arguments.length;//获取实参的数量
    return l
      ? l > 1//如果实参数量大于1
        ? fn.apply(ctx, arguments)
        : fn.call(ctx, a)//实参数量等于1
      : fn.call(ctx)//没有参数
  }
  // record original fn length//记录一下原始的形参数量
  boundFn._length = fn.length;
  return boundFn
}

/**
 * Convert an Array-like object to a real Array.//转换一个类数组的对象为真正的数组
 */
function toArray (list, start) {
  start = start || 0;//如果start存在则用start如果不存在则用0;
  var i = list.length - start;//设置新数组的数量
  var ret = new Array(i);//新建数组
  while (i--) {5
    ret[i] = list[i + start];
  }
  return ret
}
时间: 2024-10-08 15:51:07

vue.js源码学习分享(二)的相关文章

vue.js源码学习分享(一)

今天看了vue.js源码  发现非常不错,想一边看一遍写博客和大家分享 /** * Convert a value to a string that is actually rendered. *转换一个值为字符串 */ function _toString (val) { return val == null? '': typeof val === 'object'? JSON.stringify(val, null, 2): String(val)//如果该值是null则返回空字符串,如果该

vue.js源码学习分享(九)

/* */ var arrayKeys = Object.getOwnPropertyNames(arrayMethods);//获取arrayMethods的属性名称 /** * By default, when a reactive property is set, the new value is//默认情况下,当一个响应的属性被设置,新的值也转换成响应的.然而当经过向下支撑时,我们不想促使转换,因为这值也许是一个嵌套值在一个冻结的数据结构,转换它时将会失去最优化 * also conve

vue.js源码学习分享(五)

//配置项var config = { /** * Option merge strategies (used in core/util/options)//选项合并策略 */ optionMergeStrategies: Object.create(null), /** * Whether to suppress warnings.//是否抑制警告 */ silent: false, /** * Show production mode//生产模式 tip message on boot?//

Vue.js 源码学习之Flag篇

The Progressive JavaScript Framework --vuejs.org 起因 第一次接触 Vue.js 是因为要做一个通讯录的外包项目,这个项目要有前台展示和中后台管理,从轮子做起肯定是不明智的选择,所以当时初步定下的是 Vue.js + Element UI 的技术栈. 项目过程很漫长,因为给的钱实在是可有可无,权当是学习了. 项目的接口是交给了同学. 整个项目采用的是钱后端分离的开发模式,我做我的页面,他做他的接口. 项目出了两个版本,做的时候,中间就强行的看文档.

Vue.js 源码学习笔记 -- 分析前准备 待续

主体 实例方法归类: data     数据方法 dom     dom方法 event    事件处理 lifecycl   生命周期函数 init 初始化vue页面 全局方法: derectives filters init过程 data : observer deps computed watch || watcher template: fragment [ directive repeat if component transition filter ] 重点: 把数据(Model)

MVVM大比拼之vue.js源码精析

VUE 源码分析 简介 Vue 是 MVVM 框架中的新贵,如果我没记错的话作者应该毕业不久,现在在google.vue 如作者自己所说,在api设计上受到了很多来自knockout.angularjs等大牌框架影响,但作者相信 vue 在性能.易用性方面是有优势.同时也自己做了和其它框架的性能对比,在这里.今天以版本 0.10.4 为准 入口 Vue 的入口也很直白: ? 1 var demo = new Vue({ el: '#demo', data: { message: 'Hello V

从Vue.js源码角度再看数据绑定

## 写在前面 因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出.文章的原地址:[https://github.com/answershuto/learnVue](https://github.com/answershuto/learnVue).在学习过程中,为Vue加上了中文的注释[https://github.com/answershuto/learnVue/tree/master/vue-src](http

jquery源码学习(二)sizzle部分 【转】

一,sizzle的基本原理 sizzle是jquery选择器引擎模块的名称,早在1.3版本就独立出来,并且被许多其他的js库当做默认的选择器引擎.首先,sizzle最大的特点就是快.那么为什么sizzle当时其他引擎都快了,因为当时其他的引擎都是按照从左到右逐个匹配的方式来进行查找的,而sizzle刚好相反是从右到左找的. 举个简单的例子 “.a .b .c”来说明为什么sizzle比较快.这个例子如果按照从左到右的顺序查找,很明显需要三次遍历过程才能结束,即先在document中查找.a,然后

从Vue.js源码看异步更新DOM策略及nextTick

写在前面 因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出.文章的原地址:https://github.com/answershuto/learnVue.在学习过程中,为Vue加上了中文的注释https://github.com/answershuto/learnVue/tree/master/vue-src,希望可以对其他想学习Vue源码的小伙伴有所帮助.可能会有理解存在偏差的地方,欢迎提issue指出,共同学