Bootstrap3实用教程
4.1.1 插件的原理
阅读(

Bootstrap基础

Bootstrap全局样式

Bootstrap组件

Bootstrap插件

概述

插件的原理

在JavaScript中,在定义函数的时候,如果在函数体的后面加一对小括号,这个函数就会立即执行。如,以下代码定义了一个匿名函数,并立即执行:

function () { /* code */ } ();

由于它本身就是一个函数,因此可以接受参数。如,以下代码为匿名函数传入一个参数 a,它的值是 2:

(function (a) { /* code */ } (2));

当把这类函数放在一个 .js 文件中,你只需引用这个 .js 文件,这些函数便会自动执行,无需显式调用,非常方便。因此,Bootstrap 中的所有插件,都使用了这种模式。比如,以下是 button.js 文件的格式:

+function ($) {
  'use strict';

  /* other code */
}(jQuery);

这个文件的意思是声明一个函数,然后立即执行,并将jQuery对象作为函数的参数。这样作的好处是,此时函数内部的 $ 已经是局部变量,不会再受到外部作用域的影响。

function前面 + 号的作用是将函数声明转化为函数表达式,用来消除函数声明和函数表达式间的歧义。一元运算符可以算是消除歧义的最好方式,+ 号只是其中之一,你也可以使用其他一元运算符,如 !、;、+、-、=、~ 等。

关于作者

歪脖先生,十五年以上软件开发经验,酷爱Web开发,精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等,著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》、《Bootstrap3实用教程》,并全部在 GitHub 上开源。

如果本教程对您帮助很大,请随意打赏。您的支持,将鼓励我写出更好的教程!

← 键盘方向键翻页 →
返回顶部 手机访问 关注微信 返回底部

扫码访问歪脖网

随时随地,想看就看

关注歪脖网微信

分享 web 知识、交流 web 经验