题目总结 – 小飞侠

1. localstorage 和 sessionstorage 的区别

1.sessionStorage：将数据保存在session对象中。所谓session，是指用户在浏览某个网站时，从进入网站到浏览器关闭所经过的这段时间，也就是用户浏览这个网站所花费的时间。session对象可以用来保存在这段时间内所要求保存的任何数据。（浏览器关闭后不可使用）

2.localStorage：将数据保存在客户端本地的硬件设备(通常指硬盘，也可以是其他硬件设备)中，即使浏览器被关闭了，该数据仍然存在，下次打开浏览器访问网站时仍然可以继续使用。、

不支持跨域。

localstorage不支持跨域，跨域可以利用postmessage和iframe来实现

cookie：如果不设置过期时间，那么在浏览器关闭后就会被销毁

2. http 301、302、304状态码解释

301：请求的url已经永久地失效了（资源被移动到了新位置），重定向到新的 url 对其进行请求
302：重定向到新的 url，但是也可能随时改变主意，也可能会显示到旧的 url，或者其他地方。有时候搜索引擎会来决定是定向到哪个 url
304：当前请求的资源还没有过期，返回的是本地的缓存

3. 箭头函数

箭头函数内部的
this
是词法作用域，由上下文确定。

当箭头函数的函数体中定义了 this ，其 this 指向是由上下文决定的。（以往的 this 是由闭包或者函数的运行环境决定的）

// 写法1
(x,y)=>{
   
	//函数体
}
// 写法2
x=>{
   
    //函数体
}
// 写法3
x=>x+x
// 如果要返回一个对象
x=>{
   name:'joey'}// 会报错
x=>({
   name:'joey'}) // 正确写法

var obj = {
   
    birth: 1990,
    getAge: function () {
   
        var b = this.birth; // 1990
        var fn = () => new Date().getFullYear() - this.birth; // this指向obj对象
        return fn();
    }
};
obj.getAge(); // 25
//在对象中定义箭头函数，其指向obj对象

4. 解决闭包

// 函数要求：点击每个 li 标签弹出相应的innerText
// 原因：由于闭包的存在，使得内部的每个i引用的都是外部的i，因此不会达到预期
<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
</ul>
<script>
	var myli = document.getElementsByTagName('li');
    for(var i =0;i<myli.length;i++){
    
        myli[i].onclick = function(num){
     // 这一层是立即执行函数，每次换不同的i执行一次
            return function(){
     // 这一层的作用是生成一个新函数，附加在 myli[i] 上
                alert(num)
            }
        }(i)
    }
</script>

5. flex布局

6. typeof 和 instanceof

确定一个值是哪种基本类型可以使用 typeof 操作符
确定一个值是哪种引用类型可以使用 instanceof 操作符

7. 堆内存和栈内存

堆内存：存储对象 Object
栈内存：存储基本类型 Number、String 等，占据固定的空间大小

8. js五大基本数据类型

Number （NaN )
String
Boolen
Null
Undefined

9.闭包的优缺点

优点：
- 可以保留一个变量不被清除（默认的标记清除机制，当函数运行完成后会清空不需要的函数，当外部函数被内部函数引用的情况下，就不会被清空，因此会被保存）
缺点：
- 内存泄漏：当要保存的数据量很大时，优点就变成了缺点，会造成内存泄漏。

10.数组去重

方法一：indexOf

<script>
    var myarray = [1,6,6,5,43]
function arrayFunc (arr) {
   
    if (arr.length === 0) {
   
        return 0
    }
    var newArray = [];
    for (var i = 0;i<arr.length;i++) {
   
        if( newArray.indexOf(arr[i]) === -1) {
   
            newArray.push(arr[i])
        }
    }
    return newArray
}
	console.log(arrayFunc(myarray))
</script>

方法二：set

var myarray2 = [2,6,5,4,2]
console.log(new Set(myarray2))

Set：一种新数据结构

类似数组，但是没有重复元素，因此可以用来去重
set相关

// 创建新的set
var set1 = new Set ([1,2,3,2])

// set添加新的元素
set1.add(8)

// set删除元素
set1.delete(3)

// set清空元素
set1.clear()

// set是否存在某种元素
set1.has(1) // true

// set类型转数组
Array.from(set1)

11. 跨域

JSONP：使用

12. http 400、401、403状态码解释

400：请求无效，前端发送的数据格式与后端要接收的数据格式不同
401：未授权，要进入当前的URL要经过授权
403：服务器理解这次接口，但是拒绝执行此请求
404：没找到
405：method not allowed，方法出错

13. 从输入url到返回页面的过程中，发生了什么

域名解析系统 DNS 进行域名解析
建立 TCP 连接
发送 HTTP 请求
服务器处理请求并返回 HTTP 报文
浏览器渲染页面
连接结束

14. get 和 post 的一些区别

get：
- 浏览器和服务器会限制url的长度，因此get传的参数可以看成是有限制的（但是get本身是没有限制的）
- 一般用于向服务器请求获取资源，可以使用缓存
post：
- 不限制长度大小
- 一般向服务器发送数据，不使用缓存

15. mouseover 和 mouseenter的区别

mouseover：鼠标移动到父元素（和子元素）时都会触发，相当于重复触发
mouseenter：鼠标移动到父元素（不包括子元素）时会触发

16. bind、apply、call

bind：绑定函数的作用域
apply：在某个作用域中调用函数 fn.apply(作用域)，参数可以是数组
call：在某个作用域中调用函数 fn.call(作用域)，参数是arg1,arg2,…,argn排列下去

17. 用 setTimeout 实现 setInterval

function say ()<

原文链接：https://blog.csdn.net/qq_41564928/article/details/102646936