jq插件编写涉及知识点

1、自执行的匿名函数/闭包的运用：（详解https://blog.csdn.net/qq_18661257/article/details/50434475）


(function($){
	//Code
})()

首先是要创建一个对象:new C()，其中C就是相当于(function($){//Code})，()便是后面的()了。

js在"预编译"阶段, 会解释函数声明, 但却会忽略表达式。

当javascript执行到function() {//Code}()d时由于function() {//code}在"预编译"阶段已经被解释过,javascript会跳过function(){//code}试图去执行()故会报错;
当javascript执行到(function {// Code})()时由于(function {// code})是表达式, javascript会去对它求解得到返回值, 由于返回值是一个函数, 故而遇到()时, 便会被执行。

另外,函数转换为表达式的方法并不一定要靠分组操作符()我们还可以用!操作符等操作符，只要是表达一个表达式的即可。

如此大家大概知道插件得书写为什么要加个()

2、插件的步骤(https://www.cnblogs.com/ajianbeyourself/p/5815689.html)

通过$.extend()来扩展jQuery（可以声明多个函数）：

理解成jQuery身上添加了一个静态方法而以。所以我们调用通过$.extend()添加的函数时直接通过$符号调用（$.myfunction()）而不需要选中DOM元素($('#example').myfunction())
```
$.extend({
    sayHello: function(name) {
        console.log('Hello,' + (name ? name : 'Dude') + '!');
    }
})
$.sayHello(); //调用
```
通过$.fn 向jQuery添加新的方法（只能一次声明一个函数）：

在处理插件参数的接收上，通常使用jQuery的extend方法，但那是给extend方法传递单个对象的情况下，这个对象会合并到jQuery身上，所以我们就可以在jQuery身上调用新合并对象里包含的方法了，当给extend方法传递一个以上的参数时，它会将所有参数对象合并到第一个里。同时，如果对象中有同名属性时，合并的时候后面的会覆盖前面的。
$.extend({},defaults, options);

面向对象的插件开发(https://www.cnblogs.com/libin-1/p/5911190.html)

构造函数

构造函数为了和普通函数区别开来，除了用new之后，函数的命名是首字母大写
```
function Person () {
        this.name = 'lyl';
        this.age = 18;
        // 打印this对象的原型
        console.log(this.__proto__); // 
        // 验证this是否是Person构造函数的实例
        console.log(this instanceof Person); //true
     }
     new Person();//打印结果如下
Person {name: "lyl", age: 18}
理解成this.name是key是name
```
理解成this.name是key是name
查对象：Person[name]或者Person.name
增对象：Person.sex="女",
如果是变量添加：
```
var obj = {
    attr: {
    }
};
var egData = ['oneAttr', 'twoAttr', 'threeAttr'];
for (var i = 0; i < egData.length; i++) {
    obj.attr[egData[i]] = false
}
```
var json = {};json["a"]=1;console.log(json) ;{a: 1}
删对象：delete Person.sex

用new与不用new的区别：

非new:一个函数的正常执行，没有返回值，则默认返回undefined一个函数的正常执行，没有返回值，则默认返回undefined

new:ew操作符后js引擎就会将该函数看作构造函数看待，经过内部的一系列隐士操作，返回值就是一个对象了
prototype
原型链：原型链就是将一个个原型串连起来，形成一条原型继承的链子
```
原型链： Child -> new Parent() -> new GrandParent() -> new Object();
```
call/apply：这两个方法的作用是一样的https://blog.csdn.net/ganyingxie123456/article/details/70855586
foo.call(this, arg1,arg2,arg3) == foo.apply(this, arguments)== this.foo(arg1, arg2, arg3)

B.apply(A, arguments);即A对象应用B对象的方法。B.call(A, args1,args2);即A对象调用B对象的方法。

最大最小值：可以将一个数组默认的转换为一个参数列表([param1,param2,param3] 转换为 param1,param2,param3)
两个对象相等：JSON.stringify(obj)==JSON.stringify(obj);//true

jq插件编写涉及知识点

猜你喜欢