当前位置: 首页 > news >正文

Zepto.js源码学习之二

本次主要分享关于上一篇区域2的学习。
区域2为Zepto的核心部分,它的结构如下

var Zepto = (function() {
   var $, zepto = {};
   function Z(dom, selector) {}
   zepto.Z = function(dom, selector) {
      return new Z(dom, selector)
   }
   zepto.isZ = function(object) {
      return object instanceof zepto.Z
   }
   zepto.init = function(selector, context) {
      blablabla...
      return zepto.Z(dom, selector);
   }
   $ = function(selector, context) {
      return zepto.init(selector, context)
   }
   zepto.qsa = function(element, selector) {
      blablabla...
   });
   $.fn = {
      blablabla...
   };
   zepto.Z.prototype = Z.prototype = $.fn;
   $.zepto = zepto;
});

为了便于梳理思路,以上代码省略了细节,只保留了轮廓脉络。
这段代码首先定义了两个变量$和zepto,一个类Z;然后给空对象zepto定义属性和方法,其中zepto.Z得到类Z的一个实例,至于zepto.init,从默认执行return zepto.Z(dom, selector)可以得知,它也是获得类Z的实例,只是有可能因为参数不同作不同处理,在深入细节之前姑且这么理解;$是一个函数,返回值为zepto.init(),亦即类Z的实例;zepto.Z.prototype = Z.prototype = $.fn是为创建的类Z的实例设置原型属性,同时为类Z设置原型属性;$.zepto = zepto则是将以上各种处理得到的对象zepto悬挂到$上作为属性zepto。
最终暴露给开发者的$.zepto如下图所示:
clipboard.png

这里只分析了区域2的结构,下一次会深入到函数语句粒度。

相关文章:

  • JPA 深度刘宝宝剖析版
  • 利用strstr与atoi的结合实现一个C语言获取文件中数据的工具
  • 文字绘制-图片绘制-水印绘制思路
  • C语言 · Anagrams问题
  • C# - 值类型、引用类型走出误区,容易错误的说法
  • 常用网址
  • python 04
  • Python程序-离散和线性图形
  • MongoDB安全事件的一些思考
  • java之多线程的理解
  • json常用方法介绍
  • NSOperation 开发
  • 批量更新MongoDB的列。
  • SOA是什么
  • Apache HttpCore (理解IO基础)
  • 【附node操作实例】redis简明入门系列—字符串类型
  • 【剑指offer】让抽象问题具体化
  • 【译】理解JavaScript:new 关键字
  • es6要点
  • hadoop入门学习教程--DKHadoop完整安装步骤
  • httpie使用详解
  • input实现文字超出省略号功能
  • iOS小技巧之UIImagePickerController实现头像选择
  • javascript数组去重/查找/插入/删除
  • jquery cookie
  • Linux快速复制或删除大量小文件
  • php的插入排序,通过双层for循环
  • Webpack 4 学习01(基础配置)
  • windows下如何用phpstorm同步测试服务器
  • 诡异!React stopPropagation失灵
  • 看完九篇字体系列的文章,你还觉得我是在说字体?
  • 配置 PM2 实现代码自动发布
  • 三栏布局总结
  • 数据科学 第 3 章 11 字符串处理
  • 我看到的前端
  • 写给高年级小学生看的《Bash 指南》
  • 优秀架构师必须掌握的架构思维
  • 自制字幕遮挡器
  • 如何在招聘中考核.NET架构师
  • #我与Java虚拟机的故事#连载10: 如何在阿里、腾讯、百度、及字节跳动等公司面试中脱颖而出...
  • $con= MySQL有关填空题_2015年计算机二级考试《MySQL》提高练习题(10)
  • $Django python中使用redis, django中使用(封装了),redis开启事务(管道)
  • (6)【Python/机器学习/深度学习】Machine-Learning模型与算法应用—使用Adaboost建模及工作环境下的数据分析整理
  • (HAL库版)freeRTOS移植STMF103
  • (vue)页面文件上传获取:action地址
  • (第61天)多租户架构(CDB/PDB)
  • (二)c52学习之旅-简单了解单片机
  • (附源码)springboot家庭财务分析系统 毕业设计641323
  • (每日持续更新)jdk api之FileReader基础、应用、实战
  • (十五)devops持续集成开发——jenkins流水线构建策略配置及触发器的使用
  • (算法)前K大的和
  • (图)IntelliTrace Tools 跟踪云端程序
  • (一)Dubbo快速入门、介绍、使用
  • (一)Mocha源码阅读: 项目结构及命令行启动
  • (轉貼) UML中文FAQ (OO) (UML)