基本概念
闭包和即时函数的另外一个重要用途就是类库封装
类库封装要求
类库封装最重要的要求就是不能让类库中的变量污染全局。
比如jQuery只暴露 $ 就好了
(function () { var jQuery = window.$ = function() { // Intialize } })()
直立棉的两次赋值
- jQuery构造器(匿名函数)赋值给window.$ 作为全局变量
- 为了保证其他代码改变或删除jQuery变量 , 所以声明一个局部变量jQuery, 保证jQuery代码内都可以使用jQuery这个名字。
能够达到以上目的的另外一种封装
var $ = (function() { function jQuery() { // Initialize } return jQuery })()
实战Rollup
实际上Rollup使用即时函数iife只是打包方式之一,其他
其他的包括amd, cjs, es, iife, umd。咱们到了rollup面试题的时候再细说。
npx rollup -f iife -n $ -o ./dist/jquery.js ./src/jquery.js
- -f 指定iife方式输出
- -o 指定输出文件
- -n 指定输出变量名
输出结果:
var $ = (function (exports) { 'use strict'; function jQuery() { console.log('I am jQuery'); } exports.jQuery = jQuery; Object.defineProperty(exports, '__esModule', { value: true }); return exports; })({});
略有不同 主要是为了rollup实现方便。
调用
<script src="./dist/jquery.js"></script> <script> // test $() </script>
👌到这为止就把类库封装简单过了一下。下一期我们讲讲webpack打包与闭包应用。
面试攻略
- 无
点评
- 闭包处处都有,但是能说出经典应用又是一个难题。说Helloworld和背题没啥区别。