JS 链式调用

1、

 

    (function() {
      function Cat(name) {
        this.name = name
        this.run = function() {
          document.write(name + " start run ")
          return this
        }
        this.stopRun = function() {
          document.write(name + " stop run ")
          return this
        }
        this.sing = function() {
          document.write(name + " start sing ")
          return this
        }
        this.stopSing = function() {
          document.write(name + " stop sing ")
          return this
        }
      }
      var c = new Cat("Xiaomao")
      // c.run()
      // c.sing()
      // c.stopSing()
      // c.stopRun()
      c.run().sing().stopSing().stopRun()
    })()

 

2、模拟jq

 

    Function.prototype.method = function(name,fn) {
      this.prototype[name] = fn
      return this
    };
    (function() {
      function _$(els){}
      _$.onready = function(fn) {
        window.$ = function() {
          return new _$(arguments)
        }
        fn()
      }
      _$.method("addEvent",function(type,fn) {
        fn()
      }).method("getEvent",function(fn,e) {
        fn()
      }).method("addClass",function(className) {
        fn()
      }).method("removeClass",function(className) {
        fn()
      }).method("replaceClass",function(oldClass,newClass) {
        fn()
      }).method("getStyle",function(el,fn) {
        fn()
      }).method("setStyle",function(el,fn) {
        fn()
      }).method("load",function(el,fn) {
        fn()
      })
      _$.onready(function() {
        $("div01").addEvent("click",function() {
          alert("click Event")
        })
      })
    })()

 

posted @ 2019-07-18 11:17  suanmei  阅读(705)  评论(0编辑  收藏  举报