关于javascript:手写new和Ajax

首先创立了一个新的空对象
设置原型，将对象的原型设置为函数的 prototype 对象。
让函数的 this 指向这个对象，执行构造函数的代码（为这个新对象增加属性）
判断函数的返回值类型，如果是值类型，返回创立的对象。如果是援用类型，就返回这个援用类型的对象。

实现:

function myNew() {
  // 1. 创立空对象
  let obj = {}
  let constructor = [...arguments][0]
  let params = [...arguments].slice(1)

  // 2. 空对象的原型指向构造函数的原型
  obj.__proto__ = constructor.prototype

  // 3. 执行构造函数的代码
  var ret = constructor.apply(obj, params)

  // 4. 判断返回值类型：// 如果是根本值类型，则返回的创立的 '空对象'
  // 如果是援用类型，则返回这个援用类型的对象
  var flag = ret && ret instanceof Object
  return flag ? ret : obj
}
// test
function A(name) {this.name = name}
var a1 = myNew(A, 'Lee')
var a2 = new A('Lee')
console.log(a1, a2)

AJAX 包含以下几个步骤

创立 XMLHttpRequest 对象，也就是创立一个异步调用对象
创立一个新的 HTTP 申请，并指定该 HTTP 申请的办法、URL 及验证信息
设置响应 HTTP 申请状态变动的函数
发送 HTTP 申请
获取异步调用返回的数据
应用 JavaScript 和 DOM 实现部分刷新

个别实现:

const SERVER_URL = '/server'

let xhr = new XMLHttpRequest()

// 创立 Http 申请 第三个参数为 async，指定申请是否为异步形式，默认为 true。xhr.open('GET', SERVER_URL, true)

// 设置申请头信息
xhr.responseType = 'json'
xhr.setRequestHeader('Accept', 'application/json')

// 设置状态监听函数
xhr.onreadystatechange = function () {if (this.readyState !== 4) return

  // 当申请胜利时
  if (this.status === 200) {handle(this.responseText)
  } else {console.error(this.statusText)
  }
}

// 设置申请失败时的监听函数
xhr.onerror = function () {console.error(this.statusText)
}

// 发送 Http 申请
xhr.send(null)

promise 封装实现：

function getJSON(url) {
  // 返回一个 promise 对象
  return new Promise(function (resolve, reject) {let xhr = new XMLHttpRequest()

    // 新建一个 http 申请，第三个参数为 async，指定申请是否为异步形式，默认为 true。xhr.open('GET', url, true)

    // 设置状态的监听函数
    xhr.onreadystatechange = function () {
      /*0: 申请未初始化
 1: 服务器连贯已建设
 2: 申请已接管
 3: 申请解决中
 4: 申请已实现，且响应已就绪 */
      if (this.readyState !== 4) return

      // 当申请胜利或失败时，扭转 promise 的状态
      /*200: "OK"
 404: 未找到页面 */
      if (this.status === 200) {resolve(this.responseText)
      } else {reject(new Error(this.statusText))
      }
    }

    // 设置响应的数据类型
    xhr.responseType = 'json'

    // 设置申请头信息
    xhr.setRequestHeader('Accept', 'application/json')

    // 发送 http 申请
    xhr.send(null)
  })
}

关于javascript:手写new和Ajax

手写 new

new 的作用:

手写 Ajax