Js编程技巧之jQuery源码(写法篇)

305 阅读1分钟

本文介绍jQuery的一些非常有用的写法,当编写业务模块或项目的基础库时可以参考借用

逗号运算符

用逗号把多个表达式联接起来,构成一个更大的表达式。

优点:节省力气,代码精简。

一开始不是很喜欢,用惯后发现真香:

  • 一次性声明多个变量:let variable1,variable2,...
  • 搭配赋值运算符:let variable2 = 1,variable2 = 2,...

IIFE(立即调用函数表达式)

优点:私有作用域,不污染其他作用域。

适用场景:开发类库(包括 webpack 最终编译的包也是 IIFE 形式的),非共享自递归函数

//匿名函数
(function (args) {
  statements;
})(args);
//命名函数
(function fn(args) {
  statements;
})(args);
//不可访问函数fn
console.log(fn); //fn is not defined
//模块内私有自递归函数
(function fn(args) {
  while (condition) {
    fn(otherArgs);
  }
})(args);

缓存原生方法备用

将模块内经常用到原生方法,缓存在私有作用里备用。

优点:避免每次使用都要到外部作用域查找并取值。

(function () {
  //缓存数组原型方法
  var push = Array.prototype.push,
    slice = Array.prototype.slice,
    splice = Array.prototype.splice;
  //使用
  push.call(context,args)
})();

这个技巧也可以用于缓存使用频次高的函数,便于后续代码直接调用。

将构造器与实例化分开

传统上,工厂函数或构造函数是负责初始化实例对象的,而jQuery大胆地 将二者分开:

image.png

jQuery工厂函数提供入口,jQuery原型则独立出来提供方法或属性等

init方法是实际上的初始化方法。

优点:分离开二者让代码结构更加地清,也利于代码的维护与迭代、issue跟踪。