function函数和箭头函数区别。原型链。数组常用方法: 15个以上。简单数据类型和复杂数据类型。localStorage与sessionStorage区别。BFC。call、apply、bind

本文链接：https://blog.csdn.net/wangshuaibinggg/article/details/128056287

(1)函数传参的时候，传值类型和引用类型有什么区别？

首先我们要分清楚什么是传值类型，什么是引用类型？

在js中值类型也叫基本数据类型，分为以下五种：undefined、null、number、boolean、string

而引用数据类型也叫做复杂数据类型，分为以下三种：array、object、function

在本质上他们的区别为：基本数据类型的值存放在栈里面，赋值拷贝的是数据，修改拷贝后的数据不会对原来的值造成影响。复杂数据类型的栈中存放地址，堆中存放数据，赋值拷贝的是地址，修改拷贝后的数据对原有的数据有影响。

(2)数组常用方法: 15个以上

增：push unshift 返回的都是新数组的长度

删：pop shift splice（起始下标，删除的长度）返回的都是删除的数组

查：slice（起始下标，查询长度）

连接数组：concat（数组）

拼接数组：join（‘拼接符’）

分隔：split ('分隔符')

翻转数组：reverse（数组）

es5新增：

循环数组：foreach()

循环数组并返回新数组：map()

累加器：reduce()

过滤：filter ()

some() 判断数组中是否存在满足条件的项，只要有一项满足条件，就会返回true。

every() 判断数组中每一项都是否满足条件，只有所有项都满足条件，才会返回true。

数组排序：sort（）

<script>
        let arr = [
            { name: '商品1', price: 123, select: true },
            { name: '商品2', price: 156, select: false },
            { name: '商品3', price: 786, select: true },
            { name: '商品4', price: 356, select: false },
            { name: '商品5', price: 696, select: false }
        ]
        arr.sort((a, b) => {
            return a.price - b.price
        })
        console.log(arr);
    </script>

Array(5)
0: {name: '商品1', price: 123, select: true}
1: {name: '商品2', price: 156, select: false}
2: {name: '商品4', price: 356, select: false}
3: {name: '商品5', price: 696, select: false}
4: {name: '商品3', price: 786, select: true}
length: 5
[[Prototype]]: Array(0)

(1)function函数和箭头函数区别

function函数的this值是指向于调用者，谁调用它，它就指向谁

new 函数名() : this -> new创建的实例对象
对象名.函数名() : this -> 对象
函数名() : this -> window

箭头函数没有自己的this值，它是取上级作用域的this值作为自己的this值来使用，同时箭头函数没有arguments，要用 rest 参数解决。箭头函数没有原型属性

(2)原型链

每一个对象都有原型__proto__，每一个函数都有原型对象prototype，函数中对象的原型__proto__全等于函数的prototype。当访问一个对象的属性时，如果对象的属性内部不存在这个属性，就会往对象的原型里面去找。这个原型同时也会有自己的原型，就会一直顺着找下去，这就是原型链。如果还找不到，属性则获取undefined，方法则报错xxx is not defined

(1)localStorage与sessionStorage区别

1.相同点
- 作用一致：用于存储数据
- 都是只能存储字符串类型数据(上限5MB)
2.不同点：存储方式不同
- localStorage : 硬盘存储 （永久存储，页面关闭还在，存在硬盘）
- sessionStorage ：内存存储 （临时存储，页面关闭了就消失）
3.localStorage与sessionStorage如何存储引用类型数据（数组和对象）
- 转json存储

sessionStorage 与 localStorage 的接口类似，但保存数据的生命周期与

localStorage 不同：

localStorage 除非被清除，否则永久保存，一般为 5MB

sessionStorage 仅在当前会话下有效，关闭页面或浏览器后被清除
(2)BFC
所谓BFC就是块级格式上下文，是我们浏览器自带的一种渲染模式。

有四种方式开启BFC盒子：

float不是none (有float属性且不为none,此时盒子自动变成BFC盒子)
overflow属性不是visible(有overflow属性且不为visible,此时盒子自动变成BFC盒子)
position属性不是static和relative
display属性为以下值： table-cell 、 inline-block 、 table-caption

解决了：

清除元素内部浮动
解决盒子margin合并问题（塌陷也可以解决）
实现元素宽度自适应多列布局

(1)call、apply、bind区别

共同点:
- 都可以修改this，第一个参数都是修改的this
不同点
- 传参方式不同： call是逐一传参， apply是数组/伪数组传参
  - 函数名.call(修改的this,参数1,参数2....)
  - 函数名.apply(修改的this,数组/伪数组)
- 执行机制不同：call和apply会立即执行函数，bind不会立即执行
  - bind会得到一个修改this后的新函数