JS---js基础-CSDN博客

本文链接：https://blog.csdn.net/qq_52666510/article/details/123271038

类数组转换为数组：

1、call调用数组的slice方法：

Array.prototype.slice.calll(arrayLike)

2、splice方法：

Array.prototype.splice.calll(arrayLike,0)

3、apply调用数组的concat方法：

Array.prototype.concat.apply([],arrayLike)

4、通过Array.from方法：

Array.from(arrayLike)

escape，encodeURL，encodeURLComponent区别：

encodeURL对整个URL进行转义，将URL中的非法字符转换为合法字符，有特殊意义的字符不会转义。

encodeURLComponent对整个URL的组成部分进行转义，一些特殊字符也会转义。

escape和 encodeURI 的作用相同，escape 是直接在字符的 unicode 编码前加上 %u，而 encodeURI 首先会将字符转换为 UTF-8 的格式，再在每个字节前加上 %。

Ajax：

创建AJAX请求步骤：

1、创建（new）XMLHttpRequest对象。

2、open创建一个Http请求，参数分别是，请求的方法、请求的地址、是否异步和用户的认证信息。

3、添加信息和监听函数。比如说通过setRequestHeader方法来为请求添加头信息和为这个对象添加一个状态监听函数。

XMLHttpRequest对象共有5个状态：当readyState变为4的时候，代表服务器返回数据接收完成，这个时候可以通过判断请求的状态。若状态是2XX或者是304的话则代表返回正常。可以通过response中的数据来对页面进行更新了。

4、当对象的属性和监听函数设置完成后，最后调用sent方法向服务器发起请求，可以传入参数作为发送的数据体。

let xhr = new XMLHttpRequest();
//创建Http请求
xhr.open("Get",url,true);
//设置状态监听函数
xhr.onreadystatechange = function(){
if(this.readyState !== 4){
return;
}
//请求成功
if(this.status === 200){
handle(this.response);
}else{
console.error(this.statusText);
}
};
//设置请求失败的监听函数
xhr.onerror = function(){
console.error(this.statusText);
};
//设置请求头信息
xhr.responseType = "json";
xhr.setRequestHeader("Accept", "application/json");
// 发送 Http 请求
xhr.send(null);

ajax、axios、fetch区别：

ajax：在无需重新加载整个网页的情况下，能够更新部分网页。缺点：

本身是针对MVC编程，不符合前端MVVM的浪潮。

基于原生XHR开发，XHR本身的架构不清晰。

不符合关注分离原则。

配置和调用方式混乱，而且基于事件的异步模型不友好。

fetch：用的是ES6的promise对象设计的，比ajax简单得多。不是ajax的进一步封装，而是原生js，没有使用XMLHttpRequest对象。优点：
语法简单，更加语义化。

基于标准promise实现，支持async/await

更加底层，提供的API丰富（request，response)

脱离了XHR，是ES规范里最新的实现方式。

缺点：

只对网络请求报错，对400，500都当做成功的请求，服务器返回400，500错误码不会reject,只有网络错误导致请求不能完成时，fetch才会被reject。