手写new

new 的作用:

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

实现:

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}// testfunction A(name) {  this.name = name}var a1 = myNew(A, 'Lee')var a2 = new A('Lee')console.log(a1, a2)

手写Ajax

AJAX 包含以下几个步骤

  1. 创立 XMLHttpRequest 对象，也就是创立一个异步调用对象
  2. 创立一个新的 HTTP 申请，并指定该 HTTP 申请的办法、URL 及验证信息
  3. 设置响应 HTTP 申请状态变动的函数
  4. 发送 HTTP 申请
  5. 获取异步调用返回的数据
  6. 应用 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)  })}