JavaScript - 笔记速记

详细笔记见：https://blog.csdn.net/qq_39590098/article/details/104088916

let与var区别

• var以函数大括号作为作用域、let只要遇到大括号就形成作用域(叫块级作用域)如if{}或swich{}，不仅仅是函数{}

数组的splice与slice区别

• splice操作原数组；而slice生成新的数组，原数组不改变。
• splice(开始下标，长度，长度为0添加数据数据)
• slice(开始下标，结束下标)

数组的map()方法

• 返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
• map() 方法按照原始数组元素顺序依次处理元素。
• map与slice一样：不会改变原始数组。

prototype【原型对象】

• 每个函数都有原型对象，给构造函数的原型对象上添加方法，则构造函数构造出来的对象也会有该方法(即共享方法)，这是ES6之前的实现继承的解决办法。

函数对象

• 所有引用类型（函数，数组，对象）都拥有__proto__属性（隐式原型）

• 所有函数拥有prototype属性（显式原型）（仅限函数）

• 原型对象：拥有prototype属性的对象，在定义函数时就被创建

闭包

• 由于函数内部可直接读取全局变量，而函数外部不能读取函数内部的局部变量，才有了闭包这个解决办法。
• 闭包好处 ：
  • 1.可以读取其他函数内部的变量；
  • 2.可以将变量保存在内存中；
  • 3.避免全局变量的污染(防止相同的变量名出现)
• 闭包缺点：
  • 会造成内存泄漏（一块分配的内存不能使用也不能回收）
• 解决内存泄漏办法：手动将使用的对象置为null
• 闭包实战中使用场景：使用循环给元素都添加点击事件

call、apply、bind：强制类型转换

关于ES6

const常量、let

箭头函数

• 推荐使用在数组的filter(item=>item>10)、map(item=>item*1.3)中

解构

• 函数可以返回多个值

集合特点

• 1.不重复
• 2.无序

字符串模板（反引号拼接)

• 更方便，看起来清晰
• 变量的表示： ${变量名}

Object.assign(对象1、对象2、对象3)

• 将传入的对象合并成一个新对象

跨域

• 只要：协议/域名(IP)/端口号其中一个不同，都算跨域

跨域的三种方式

• 1.修改ajax同源协议
• 2.后台操作
• 3.JSONP：通过创建script标签，在其中封装好方法用来接收数据，将src属性设置成下载链接。

Ajax

• 原生Ajax的使用

 1. 先new XMLHttpRequest对象，
 2. .open(请求方式get/post，请求路径，是否异步)
 3. .send()发送请求
 4. .onreadystatechange = function () {
  	if( xhr.readyState == 4){
  		根据状态码，进行相应操作
  	}
  }

• JQuery中Ajax的使用

$.ajax({
            url: '/getUsers',
            type: 'get',
            dataType: 'json',
            data: {
                //'a': 1,
                //'b': 2,
            },
            success: function (response) {
                console.log(response)；
            }
        })

• 缺点：
  • 只为使用ajax却要引入JQuery

Axios 【对ajax的封装】

• axios的使用

		    axios({
	            url: '/getUsers',
	            method: 'get',
	            responseType: 'json', // 默认的
	            data: {
	                //'a': 1,
	                //'b': 2,
	            }
	        }).then(function (response) {
	            console.log(response);
	            console.log(response.data);
	        }).catch(function (error) {
	        		console.log(error);
	        }）

• 使用axios的优点（对比ajax）：
  • 支持 Promise API
  • 客户端支持防止CSRF（即跨域请求伪造）
  • 提供了一些并发请求的接口、自动转换JSON数据