betway必威-betway必威官方网站
做最好的网站

深入理解jQuery,JavaScript中的普通函数与构造函数

构造函数init里面的return this其实删掉也无妨,至于作者为啥要加这句,呃,可能是因为知道的太多。

 $("<div><a>大家好</a></div>").append("body"); //复杂标签:含有子节点.

2.return的是Object
这种情况下,不再返回this对象,而是返回return语句的返回值。

jQuery中最常用方法的就是jQuery( ),也即$( )

传入一个jQuery对象,则创建该jQuery对象的一个副本并返回,副本与传入的jQuery对象引用完全相同的Dom对象.

1.用new关键字调用

图片 1

 //$(html[,json对象])
  $("<div></div>", {
             "class": "gys", //因为class是js的关键字,所以要加引号
             text: "大家好",
             click: function () { alert("点我干嘛"); }
         }).append("body");

现在我有另外一个cat对象:

图片 2

四:$(自定义对象)封装普通对象为jQuery对象.

2.第二步,将构造函数Prince()中的this指向新创建的对象prince。
3.第三步,将prince的_proto_属性指向Prince函数的prototype,创建对象和原型间关系
4.第四步,执行构造函数Prince()内的代码。

将上述代码写在一个自执行函数内(形成私有作用域,避免命名空间污染),就构成了jQuery的核心框架(简化版):

$(jQuery Object);

var cat={sound:'喵喵喵'}

这么做技术上并没有什么问题,但是jQuery的作者并没有这么做,可能是出于某种技术洁癖或者我暂时不清楚的原因,init被定义在了jQuery函数的原型中:

六:$(jQuery对象)接受一个jQuery对象,返回一个jQuery对象的拷贝副本

dog.bark.call(cat);

您可能感兴趣的文章:

  • JavaScript/jQuery、HTML、CSS 构建 Web IM 远程及时聊天通信程序
  • jQuery的初始化与对象构建之浅析
  • 使用jQuery.wechat构建微信WEB应用
  • jQuery学习笔记之jQuery构建函数的7种方法
  • Jquery 快速构建可拖曳的购物车DragDrop
  • 精选的10款用于构建良好易用性网站的jQuery插件
  • 读jQuery之三(构建选择器)
  • JQuery 构建客户/服务分离的链接模型中Table分页代码效率初探
  • JQuery 构建客户/服务分离的链接模型中Table中的排序分析
  • 实例详解jQuery的无new构建

 //$(htmlStr[,文档对象])
         $("<div>大家好</div>").append("body"); //简单标签:不带子节点

 function fn(a,b){
    return a b;
  }
  alert(fn(2,3));//alert:5

jQuery( )是一个函数调用,调用的结果是返回了一个jQuery实例对象。

当html是简单标签时,那么她的第二个参数可以是一个json对象,包含了这个dom元素的属性或事件.

4.函数命名建议首字母大写,与普通函数区分开。 不是命名规范中的,但是建议这么写。

通过init作为中转站,最终return出了一个jQuery实例。看上去更“雅致”,更有“技术范”。

 ("div.guo").click(function () {
             $(this).slideUp();
         });

我也想让这个cat对象可以调用bark方法,这时候就不用重新为它定义bark方法了,可以用call/apply调用Dog类的bark方法:

图片 3

 $(function () { })

    this.name //this指向window对象
   
2.函数调用

要理解上述结构的工作原理,必须理解JavaScript基于构造函数和原型的继承模式。

$(object);

 prince.age;//25
    Prince.age;//undefined

编写组件通常的做法是将组件封装成一个对象,需要用的时候则通过new运算符来创建一个实例。但是jQuery( )无须我们用new手工实例化,它会自动返回一个实例。

三:$(dom元素),$(dom元素集合)将dom元素转换成jQuery对象.

4.函数命名以驼峰方式,首字母小写

当函数调用表达式前出现了关键字new,这个函数就成了构造函数,此时会依次发生四件事:

七:$()创建一个空jQuery对象.

function Dog(){
  this.sound="汪汪汪";
}
Dog.prototype.bark=function(words){
  alert(this.sound " " words);
}
var dog=new Dog();
dog.bark("有小偷");//alert:汪汪汪  有小偷
Dog.prototype.bark.call(cat,"饿了");//alert:喵喵喵  饿了

     2、该空对象继承构造函数的原型中的属性和方法。这也是为什么要把方法都写在构造函数的prototype里。

五:$(回调函数)绑定ready事件监听函数,当Dom加载完成时执行.

    var prince=new Prince("charming",25);

总结

jQuery会使用文档碎片buildFragment()的方法将所有子节点一次性的全部插入到[,文档对象]中,如果这里不指定的话,就是document; $(html[,json对象]) 

1.第一步,创建一个空对象。

以上就是jQuery()方法构建原理的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

复制代码 代码如下:

举个栗子:

图片 4

 var obj = { name: "guo", age: 24 };
 var $obj = $(obj);
 $obj.on("guo", function () {
  alert("出发了一个自定义的事件");
 });
 $obj.trigger("guo");

Dog.prototype.bark.call(cat);

本文由betway必威发布于网页设计,转载请注明出处:深入理解jQuery,JavaScript中的普通函数与构造函数

Ctrl+D 将本页面保存为书签,全面了解最新资讯,方便快捷。