JavaScript封装回调函数（委托）

最新推荐文章于 2024-12-16 21:40:03 发布

原创最新推荐文章于 2024-12-16 21:40:03 发布 · 3.4k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#JavaScript封装回调函数（委托）

JavaScript 专栏收录该内容

23 篇文章

订阅专栏

本文探讨了JavaScript中如何进行回调函数的封装，重点介绍了委托技术的应用，旨在提高代码的可读性和可维护性。

JavaScript封装回调函数（委托）

封装

    function ajax (method, url, params, done) {
      method = method.toUpperCase()
      var xhr = new XMLHttpRequest()

      if (typeof params === 'object') {
        var tempArr = []
        for (var key in params) {
          var value = params[key]
          tempArr.push(key + '=' + value)
        }
        params = tempArr.join('&')
      }

      if (method === 'GET') {
        url += '?' + params
      }

      xhr.open(method, url,)

      var data = null
      if (method === 'POST') {
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')
        data = params
      }

      xhr.onreadystatechange = function () {
        if (this.readyState !== 4) return
        // 不应该在封装的函数中主观的处理响应结果
        done(this.responseText)
      }

      xhr.send(data)
    }

调用

  var onDone = function (res) {
      console.log('hahahahaha')
      console.log('hohohohoho')
      console.log(res)
      console.log('做完了')
    }

    ajax('get', 'time.php', {}, onDone)