JS问题笔记——模拟Jq底层实现工厂模式

<script type="text/javascript">

(function (window,undefined){

    function _$(arguments)
    {

    }

    _$.prototype={
        constructor:_$,
        addEvent:function(){

                alert("addEvent");
                return this;
        },
        getStyle:function(){
                alert(‘getStyle‘);
                return this;
        }
    }
    window.$=_$;

    _$.onReady=function(fn){
        window.$=function(){
            return new _$(arguments);
        }

        fn();

    }

})(window)

$.onReady(function(){
    $("inq").addEvent().getStyle();
})

</script>

<script type="text/javascript">

(function (window,undefined){

    function _$(arguments)
    {

    }
    Function.prototype.method=function(methodName,fn)
    {
            this.prototype[methodName]=fn;
            return this;
    }

    _$.prototype={
        constructor:_$,
        addEvent:function(){

                alert("addEvent");
                return this;
        },
        getStyle:function(){
                alert(‘getStyle‘);
                return this;
        }
    }
    window.$=_$;

    _$.onReady=function(fn){
        window.$=function(){
            return new _$(arguments);
        }

        _$.method(‘addEvent‘,function(){
            alert("addEvent2");
                return this;
        }).method(‘getStyle‘,function(){
        alert("getStyle2");
                return this;
        });
fn();
    }

})(window)

$.onReady(function(){
    $("inq").addEvent().getStyle();
})
 //为什么要加_$.method()? 不加也行?
</script>
时间: 2024-12-16 09:28:18

JS问题笔记——模拟Jq底层实现工厂模式的相关文章

java/android 设计模式学习笔记(4)---抽象工厂模式

再来介绍一下抽象工厂模式(Abstact Factory Pattern),也是创建型模式之一,上篇博客主要介绍了工厂方法模式.抽象工厂模式和工厂方法模式稍有区别.工厂方法模式中工厂类生产出来的产品都是具体的,也就是说每个工厂都会生产某一种具体的产品,但是如果工厂类中所生产出来的产品是多种多样的,工厂方法模式也就不再适用了,就要使用抽象工厂模式了. 抽象工厂模式的起源或者最早的应用,是对不同操作系统的图形化解决方案,比如在不同操作系统中的按钮和文字框的不同处理,展示效果也不一样,对于每一个操作系

js - 创建对象的几种方式(工厂模式、构造函数模式、原型模式)

原文引用https://www.dazhuanlan.com/2019/08/26/5d62f8b594f10/ 工厂模式 做法:内部创建一个对象,并未对象属性赋值并且返回 缺点:解决创建多个相识对象的问题,但不能识别创建的对象的类型 构造函数模式 做法:直接将属性和方法赋值给 this 对象,没有 return 语句 缺点:对象不是共用方法和属性,每 new 一次对象就要创建一个内存,超出性能消耗 原型模式 做法:通过 prototype 为对象添加属性 缺点:每个实例都共享属性方法,实例中修

设计模式学习笔记(十一:抽象工厂模式)

1.1概述 提供一个创建一系列或相互依赖对象的接口,而无须指定他们具体的类.这就是抽象工厂模式的定义. 设计某些系统时可能需要为用户提供一系列相关的对象,但系统不希望用户直接使用new运算符实例化这些对象,而是应当由系统来控制这些对象的创建,否则用户不仅要清楚地知道使用哪些类来创建这些对象,而且还必须要清楚对象之间是如何关联的,使得用户的代码和这些类形成紧耦合.缺乏弹性.不利于维护. 例如,军队要为士兵(用户)提供机关枪.手枪以及相应的子弹,但军队系统不希望由士兵提供来生产机关枪.手枪以及子弹,

笔记-大话设计模式-15 抽象工厂模式

抽象工厂模式(Abstract Factory),提供一个创建一系列相关或相互依赖对象的接口,而无需指定它们具体的类. 所有在用简单工厂的地方,都可以考虑用反射技术来去除switch或if,解除分支判断带来的耦合. Demo: interface IUser { void Insert(User user); User GetUser(int id); } class User { private int _id; public int Id { get { return _id; } set

设计模式学习笔记(二)--简单工厂模式和工厂模式

老生长谈的两个设计模式了,这里把这两个设计模式对比着来总结一下. 什么是简单工厂模式? 简单工厂模式:根据传入工厂类的参数动态决定要创建哪一个产品类的实例. UML图如下(以实现一个计算器为例): 简单工厂模式的Java代码实现如下: 1 package designPattern; 2 /** 3 * 简单工厂模式 4 * @author yiRain 5 * 6 */ 7 public class SimpleFactory { 8 9 public static void main(Str

js创建对象的几种方式(工厂模式、构造函数模式、原型模式)

普通方法创建对象 var obj = { name:"猪八戒", sayname:function () { alert(this.name); } } var obj1 = { name:"沙和尚", sayname:function () { alert(this.name); } } var obj2 = { name:"孙悟空", sayname:function () { alert(this.name); } } obj.saynam

js模拟jq获取id

js模拟jq获取id: (jquery)需要自己添加 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js模拟jq的点击效果</title> <style> * {margin: 0; padding: 0;} #btn {display:block;height: 30px; width:

sizzle.js学习笔记利用闭包模拟实现数据结构:字典(Map)

sizzle.js学习笔记利用闭包模拟实现数据结构:字典(Map) 这几天学习和查看了jQuery和Property这两个很流行的前端库的御用选择器组件Sizzle.js的源代码,收获还是相对多的!之前一直做使用Java语言开发,其丰富的组件类库使得开发效率那叫一个快呀!突然转来做JavaScript一时间还有点儿不适应(快半年了),不过自从看见那么多漂亮的网站和对JavaScript接触的越来越多,也发现了其中的一些乐趣.正如自己一直坚信的那样,编程语言仅仅是工具,重要的是编程思想!使用Jav

《JS设计模式笔记》 2,简单工厂模式

1 <script type="text/javascript"> 2 //简单工厂模式 3 //定义:由一个方法来决定到底要创建哪个类的实例,而这些实例经常拥有相同的接口.其实例在编译的时候不确定,而是在执行的时候确定. 4 var request1=Request("cgi.xx.com/xxx","get"); 5 request1.start(); 6 request1.done(fn); 7 var request2=Req