写代码啦
期中考试
回复数(0) 浏览数(23)
{{topic.upvote_count || 0}} 编辑 回复

1 闭包

在JavaScript中函数可以读取全局变量,但是外部不可以读取到函数内部的局部变量
闭包就是能够读取其他函数内部的变量的函数

function f1(){
    var n=999;
    function f2(){
      alert(n);
    }
    return f2;
  }
  var result=f1();
  result();

上述代码中f2就是闭包
上述代码的运行结果是999,f2可以访问f2函数外的变量n= 999,f1通过return f2 来输出f2调用n = 999的结果
从上面的例子也可以看出闭包的用途就是访问函数内的变量
闭包的另一个用途就是可以让这些变量的值始终保存在内存中

function f1(){
    var n=999;
    nAdd=function(){n+=1}
    function f2(){
      alert(n);
    }
    return f2;
  }
  var result=f1();
  result();
  nAdd();
  result();

上面代码的输出结果是第一次是999,第二次是1000,因为中间调用了一次nAdd(),在调用nAdd()之前,同上f2调用var n = 999,输出结果,在调用nAdd ()时,n=999,并没有改变也没有清楚,所以n+=1变成1000,再次result输出1000,说明n被保存在了内存中,没有清除。
闭包的缺点也就可以从上面的例子中显而易见:占内存
总结闭包
1. 闭包就是可以反问其他函数内部变量的函数
2. 闭包的用途:1可以访问其他函数内部变量,2 可以使变量始终保存在内存中
3. 闭包的缺点:占内存

2 call, apply, bind

这三个方法都是用于改变this的指向
在说区别之前还是先总结一下三者的相似之处:
1、都是用来改变函数的this对象的指向的。
2、第一个参数都是this要指向的对象。
3、都可以利用后续参数传参
对于三者的不同下面会给出几个例子

let xw = {
name : "小王",
gender : "男",
age : 24,
say : function(school,grade) {
alert(this.name + " , " + this.gender + " ,今年" + this.age + " ,在" + school + "上" + grade);
}
}
let xh = {
name : "小红",
gender : "女",
age : 18
}

可以看到say方法多了两个参数,我们通过call/apply的参数进行传参。
对于call来说是这样的

xw.say.call(xh,"实验小学","六年级");

对于apply来说是这样的

xw.say.call(xh,["实验小学","六年级"]);

call后面的参数与say方法中是一一对应的,而apply的第二个参数是一个数组,数组中的元素是和say方法中一一对应的,这就是两者最大的区别。
对于bind来说

xw.say.bind(xh)("实验小学","六年级");

因为bind是一个函数,所以需要在调用的时候在进行传参

3.状态码

状态码:
2xx表示请求被正常处理
204 No Content 请求成功,但没有资源返回客户端
206 Partial Content 对资源某一部分的请求
3xx 表示浏览器需要执行某些特殊的处理来正确处理请求
301 Moved Permanently 永久性重定向
302 Found 临时性重定向
303 See Other 查看其他地址
304 Not Modified 未修改
307Temporary Redirect 临时重定向(使用GET请求重定向)
4xx 请求错误
400 Bad Request 客户端请求的语法错误,服务器无法理解
401Unauthorized请求要求用户的身份认证
403 Forbidden服务器理解请求客户端的请求,拒绝执行此请求
404 Not Found 网页不存在
5xx 服务器错误
500 Internal Server Error 服务器内部错误,无法完成请求
503 Service Unavailable 由于超载或系统维护,服务器暂时无法处理客户端请求

6 JS继承

  1. 原型的继承
      function DOG(name){     this.name = name;   }   DOG.prototype = { species : '犬科' };   var dogA = new DOG('大毛');   var dogB = new DOG('二毛');   alert(dogA.species); // 犬科   alert(dogB.species); // 犬科
    dogA 和dogB继承了DOG的species属性
  2. class 继承
    class Point { constructor(x, y) { this.x = x; this.y = y; } } class ColorPoint extends Point { constructor(x, y, color) { this.color = color; // ReferenceError super(x, y); this.color = color; // 正确 }
    通过colorPoint通过extends 继承类Point中的所有属性,super(x,y)是指父类的x,y,在调用super只有才可以使用this
    ### 8 promise
  3. Promise 的用途
    回调函数是对一个结果进行回调,如果在异步任务重有两个结果:成功和失败就可以使用Promise进行回调
  4. 创建一个new Promise:return new Promise ((resolve,reject)=>{ }) 任务成功调用resolve(result),任务失败调用reject(error)

  5. const promise1 = new Promise((resolve, reject) => { resolve('Success!'); }); promise1.then((value) => { console.log(value); });
    注意:如果忽略针对某个状态的回调函数参数,或者提供非函数 (nonfunction) 参数,那么 then 方法将会丢失关于该状态的回调函数信息,但是并不会产生错误.
  6. Promise.all(iterable)
    Promise.all(iterable) 方法返回一个 Promise 实例,此实例在 iterable 参数内所有的 promise 都“完成(resolved)”或参数中不包含 promise 时回调完成(resolve);如果参数中 promise 有一个失败(rejected),此实例回调失败(reject),失败的原因是第一个失败 promise 的结果。
    Promise.all()传入的iterable一定是个数组,或者为空
    ```
    const promise1 = Promise.resolve(3);
    const promise2 = 42;
    const promise3 = new Promise((resolve, reject) => {
    setTimeout(resolve, 100, 'foo');
    });

Promise.all([promise1, promise2, promise3]).then((values) => {
console.log(values);
});

4. 如何使用Promise.race
Promise.race(iterable) 方法返回一个 promise,一旦迭代器中的某个promise解决或拒绝,返回的 promise就会解决或拒绝。

const promise1 = new Promise((resolve, reject) => {
setTimeout(resolve, 500, 'one');
});

const promise2 = new Promise((resolve, reject) => {
setTimeout(resolve, 100, 'two');
});

Promise.race([promise1, promise2]).then((value) => {
console.log(value);
});
```
应该输出“two”两个promise都完成了,promise2时间更快所以输出“two”

同源 跨域

  1. 源 = 协议 +域名 + 端口号
    只有两个url的协议,域名和端口号三个都完全一致时,则为同源
  2. 同源策略是浏览器故意设计的一个功能限制,跨域就是去突破这个同源限制,也就是当请求的url的协议,域名或者端口号,又一个和当前的url不同时就为跨域,跨域是访问不同浏览器的数据不是指访问图片等
  3. JSONP 跨域
    JSONP跨域的方法是对不支持CROS的浏览器使用的,jsonp是通过将要访问的数据存放在js的回调函数中,这样就可以通过js回调来访问到想要反问的数据实现跨域
    这种跨域方法的优点是可以兼容IE,还能实现跨域,缺点是因为script读不到状态码,只能知道成功或者失败,而且只能发个get请求,不能发post请求(GET请求时从服务器获取数据,POST是向服务器提交要被处理的数据)
  4. CROS 跨域
    CORS 是跨域资源分享(Cross-Origin Resource Sharing)的缩写。它是 W3C 标准,属于跨源 AJAX 请求的根本解决方法普通跨域请求:只需服务器端设置Access-Control-Allow-Origin
{{topic.upvote_count || 0}}

1 闭包

在JavaScript中函数可以读取全局变量,但是外部不可以读取到函数内部的局部变量
闭包就是能够读取其他函数内部的变量的函数

function f1(){
    var n=999;
    function f2(){
      alert(n);
    }
    return f2;
  }
  var result=f1();
  result();

上述代码中f2就是闭包
上述代码的运行结果是999,f2可以访问f2函数外的变量n= 999,f1通过return f2 来输出f2调用n = 999的结果
从上面的例子也可以看出闭包的用途就是访问函数内的变量
闭包的另一个用途就是可以让这些变量的值始终保存在内存中

function f1(){
    var n=999;
    nAdd=function(){n+=1}
    function f2(){
      alert(n);
    }
    return f2;
  }
  var result=f1();
  result();
  nAdd();
  result();

上面代码的输出结果是第一次是999,第二次是1000,因为中间调用了一次nAdd(),在调用nAdd()之前,同上f2调用var n = 999,输出结果,在调用nAdd ()时,n=999,并没有改变也没有清楚,所以n+=1变成1000,再次result输出1000,说明n被保存在了内存中,没有清除。
闭包的缺点也就可以从上面的例子中显而易见:占内存
总结闭包
1. 闭包就是可以反问其他函数内部变量的函数
2. 闭包的用途:1可以访问其他函数内部变量,2 可以使变量始终保存在内存中
3. 闭包的缺点:占内存

2 call, apply, bind

这三个方法都是用于改变this的指向
在说区别之前还是先总结一下三者的相似之处:
1、都是用来改变函数的this对象的指向的。
2、第一个参数都是this要指向的对象。
3、都可以利用后续参数传参
对于三者的不同下面会给出几个例子

let xw = {
name : "小王",
gender : "男",
age : 24,
say : function(school,grade) {
alert(this.name + " , " + this.gender + " ,今年" + this.age + " ,在" + school + "上" + grade);
}
}
let xh = {
name : "小红",
gender : "女",
age : 18
}

可以看到say方法多了两个参数,我们通过call/apply的参数进行传参。
对于call来说是这样的

xw.say.call(xh,"实验小学","六年级");

对于apply来说是这样的

xw.say.call(xh,["实验小学","六年级"]);

call后面的参数与say方法中是一一对应的,而apply的第二个参数是一个数组,数组中的元素是和say方法中一一对应的,这就是两者最大的区别。
对于bind来说

xw.say.bind(xh)("实验小学","六年级");

因为bind是一个函数,所以需要在调用的时候在进行传参

3.状态码

状态码:
2xx表示请求被正常处理
204 No Content 请求成功,但没有资源返回客户端
206 Partial Content 对资源某一部分的请求
3xx 表示浏览器需要执行某些特殊的处理来正确处理请求
301 Moved Permanently 永久性重定向
302 Found 临时性重定向
303 See Other 查看其他地址
304 Not Modified 未修改
307Temporary Redirect 临时重定向(使用GET请求重定向)
4xx 请求错误
400 Bad Request 客户端请求的语法错误,服务器无法理解
401Unauthorized请求要求用户的身份认证
403 Forbidden服务器理解请求客户端的请求,拒绝执行此请求
404 Not Found 网页不存在
5xx 服务器错误
500 Internal Server Error 服务器内部错误,无法完成请求
503 Service Unavailable 由于超载或系统维护,服务器暂时无法处理客户端请求

6 JS继承

  1. 原型的继承
      function DOG(name){     this.name = name;   }   DOG.prototype = { species : '犬科' };   var dogA = new DOG('大毛');   var dogB = new DOG('二毛');   alert(dogA.species); // 犬科   alert(dogB.species); // 犬科
    dogA 和dogB继承了DOG的species属性
  2. class 继承
    class Point { constructor(x, y) { this.x = x; this.y = y; } } class ColorPoint extends Point { constructor(x, y, color) { this.color = color; // ReferenceError super(x, y); this.color = color; // 正确 }
    通过colorPoint通过extends 继承类Point中的所有属性,super(x,y)是指父类的x,y,在调用super只有才可以使用this
    ### 8 promise
  3. Promise 的用途
    回调函数是对一个结果进行回调,如果在异步任务重有两个结果:成功和失败就可以使用Promise进行回调
  4. 创建一个new Promise:return new Promise ((resolve,reject)=>{ }) 任务成功调用resolve(result),任务失败调用reject(error)

  5. const promise1 = new Promise((resolve, reject) => { resolve('Success!'); }); promise1.then((value) => { console.log(value); });
    注意:如果忽略针对某个状态的回调函数参数,或者提供非函数 (nonfunction) 参数,那么 then 方法将会丢失关于该状态的回调函数信息,但是并不会产生错误.
  6. Promise.all(iterable)
    Promise.all(iterable) 方法返回一个 Promise 实例,此实例在 iterable 参数内所有的 promise 都“完成(resolved)”或参数中不包含 promise 时回调完成(resolve);如果参数中 promise 有一个失败(rejected),此实例回调失败(reject),失败的原因是第一个失败 promise 的结果。
    Promise.all()传入的iterable一定是个数组,或者为空
    ```
    const promise1 = Promise.resolve(3);
    const promise2 = 42;
    const promise3 = new Promise((resolve, reject) => {
    setTimeout(resolve, 100, 'foo');
    });

Promise.all([promise1, promise2, promise3]).then((values) => {
console.log(values);
});

4. 如何使用Promise.race
Promise.race(iterable) 方法返回一个 promise,一旦迭代器中的某个promise解决或拒绝,返回的 promise就会解决或拒绝。

const promise1 = new Promise((resolve, reject) => {
setTimeout(resolve, 500, 'one');
});

const promise2 = new Promise((resolve, reject) => {
setTimeout(resolve, 100, 'two');
});

Promise.race([promise1, promise2]).then((value) => {
console.log(value);
});
```
应该输出“two”两个promise都完成了,promise2时间更快所以输出“two”

同源 跨域

  1. 源 = 协议 +域名 + 端口号
    只有两个url的协议,域名和端口号三个都完全一致时,则为同源
  2. 同源策略是浏览器故意设计的一个功能限制,跨域就是去突破这个同源限制,也就是当请求的url的协议,域名或者端口号,又一个和当前的url不同时就为跨域,跨域是访问不同浏览器的数据不是指访问图片等
  3. JSONP 跨域
    JSONP跨域的方法是对不支持CROS的浏览器使用的,jsonp是通过将要访问的数据存放在js的回调函数中,这样就可以通过js回调来访问到想要反问的数据实现跨域
    这种跨域方法的优点是可以兼容IE,还能实现跨域,缺点是因为script读不到状态码,只能知道成功或者失败,而且只能发个get请求,不能发post请求(GET请求时从服务器获取数据,POST是向服务器提交要被处理的数据)
  4. CROS 跨域
    CORS 是跨域资源分享(Cross-Origin Resource Sharing)的缩写。它是 W3C 标准,属于跨源 AJAX 请求的根本解决方法普通跨域请求:只需服务器端设置Access-Control-Allow-Origin
23
回复 编辑