前端js面试题(未完)

# js基础

## js数据类型

基础数据类型包括:

1.布尔值（Boolean）：表示真或假的值。只有两个可能的值：true和false。

2.数字（Number）：表示数值。可以是整数或浮点数。例如：42、3.14等。

3.字符串（String）：表示文本数据。用引号（单引号或双引号）括起来的一串字符。例如："Hello"、'World'等。

4.空值（Null）：表示空值或不存在的值。只有一个可能的值：null。

5.未定义（Undefined）：表示未定义的值。只有一个可能的值：undefined。

特点:基础数据类型的值是不可变的（immutable），也就是说，一旦创建了一个基础数据类型的值，就无法修改它。

引用数据类型包括:

1.对象（Object）：表示复杂的数据结构，可以包含多个键值对。例如：{ name: 'John', age: 25 }。

2.数组（Array）：表示一组有序的数据集合。例如：[1, 2, 3, 4]。

3.函数（Function）：表示可执行的代码块，可以被调用执行。例如：function add(a, b) { return a + b; }。

4.符号（Symbol）：表示唯一的标识符。在ES6中引入。

特点:引用数据类型的值是可变的


#### null 和 undefined 区别？？

undefined:表示变量声明但未初始化时的值

null:类型被看做空对象指针，只有一个值，即null值，所以在用typeof操作符去检测null类型的值得时候，结果是object类型


## 判断js数据类型
1.typeof
2.instanceof
3、constructor
4、Object.prototype.toString

## 闭包
能访问其他函数内部变量的函数。
这些变量的值始终保持在内存中 不会再外层函数调用后背自动清除
### 优点
变量长期驻扎在内存中
减少全局变量的污染
### 特性
1、函数嵌套函数
2、内部函数可以直接使用外部函数的局部变量或参数
3、变量或者参数不会被垃圾回收
### 缺点
1、常驻内存会增大内存的使用量，使用不当会造成内存泄漏。
### 闭包的使用场景
1、返回值
2、函数赋值
3、函数参数
4、自执行函数
5、循环赋值
6、getter setter
7、迭代器
8、首次区分
9、缓存
### 什么是内存泄露
内存泄漏指任何对象在不再拥有或需要它之后仍然存在
setTimeout 的第一个参数使用字符串而非函数的化 会造成内存泄漏

## 原型 原型链
### 原型
指的是显式原型prototype和隐式原型__proto__
每一个函数都有prototype属性
### 原型链
当访问一个对象的某个属性时，会现在这个对象本身属性上查找，如果没有找到则会去他的隐式原型__proto__上去找
即它的构造函数prototype 如果没有找到就会在构造函数的peototype的__proto__中去找 这样一层一层的找就会形成一个链式结构我们成为原型链

## js的继承
1、原型链继承
2、借用构造函数继承
3、组合继承
4、型式继承
5、寄生式继承
6、寄生组合式继承



## js中数组的方法
1、push()返回数组中元素的个数，向数组尾部中增加元素，有多少加多少，原数组发生改变
2、pop()从数组的尾部删除一个元素，返回这个删除的元素，不接收参数
3、unshift()返回数组中元素的个数向数组的头部增加元素，括号中有多少就加多少，原数组发生改变
4、shift()从数组的头部删除一个元素，返回这个删除的元素，不接收参数
5、slice(start,end)截取数组，不会修改当前数组
start 必需。规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。也就是说，-1 指最后一个元素，-2 指倒数第二个元素，以此类推。
end 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数，那么它规定的是从数组尾部开始算起的元素。
6、splice（）可删除从 index 处开始的零个或多个元素，并且用参数列表中声明的一个或多个值来替换那些被删除的元素。
7、reverse() 数组翻转，该方法会改变原来的数组，而不会创建新的数组
8、sort()//无参数默认从小到大排序 回调方法（a,b）=>b-a可将数组安装从大到小排序
9、concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组。
10、join(’-’) //将数组转化为为字符串，以括号内的拼接
```
1 <script>
 2     var arr =new Array(1,2,3,4,5,6,7,8,9);
 3 //push()返回数组中元素的个数，向数组尾部中增加元素，有多少加多少，原数组发生改变。
 4      var length=arr.push(10)
 5      console.log(arr)//[1,2,3,4,5,6,7,8,9,10]
 6      console.log(length)//10
 7 
 8
 9  //pop()从数组的尾部删除一个元素，返回这个删除的元素，不接收参数
10       arr.pop()
11       console.log(arr)//[1,2,3,4,5,6,7,8,9]
12        arr.unshift(0)//返回数组中元素的个数向数组的头部增加元素，括号中有多少就加多少，原数组发生改变
13        arr.shift()//从数组的头部删除一个元素，返回这个删除的元素，不接收参数
14        arr.slice(4)//从下标为4的开始截取，直至数组结束
15        arr.slice(0,2)//从下标0开始截取，到下标2结束，不包含下标2的数，此方法原数组不变
16        arr.splice(4)//一个参数，从下标4对应的位置开始删除，直到数组结束,返回被删除后的项目 arr=[0,1,2,3]
17        arr.splice(4,2)//两个参数从下标为4开始，第二个参数删除的长度 arr=[0,1,2,3,6,7,8,9]
18        arr.splice(4,2,10,20);//三个及三个以上的参数。从下标为4的位置开始删除，删除两个元素，并用10,20替换             掉删除的元素。 arr=[0, 1, 2, 3, 10, 20, 6, 7, 8, 9]
19        arr.reverse()//数组翻转，该方法会改变原来的数组，而不会创建新的数组  [9, 8, 7, 6, 5, 4, 3, 2, 1, 0]
20        arr.sort()//无参数默认从小到大排序，判断方式：按位判断
21        arr.sort(function(a,b){//从大到小排序
22                 return b-a;
23           })
24          var arr1=[11,12]
25          var arr3=arr1.concat(arr,33,44)//将arr1,arr,33,44拼接为一个新的数组，用arr3接收
26          arr.join('-') //将数组转化为为字符串，以括号内的拼接
27 </script>
```

## 数组遍历的方法
1、for循环  
```
//使用变量缓存临时数组
for(i=0;i<arr.length;i++)
{    
//执行代码块
console.log(i)
}
```
2、forEach循环
```
//遍历数组中的每一项，没有返回值，对原数组没有影响，不支持IE
arr.forEach((item,index,array)=>{
    //执行代码
item+=1;
})
//数组中有几项，那么传递进去的匿名回调函数就需要执行几次；

```
3、map循环
```
//map的回调函数中支持return返回值
arr.map(function(value,index,array){
  
　　//执行代码
  return xxx
  
})

```
4、for..of遍历
```
//可以正确响应break、continue和return
for (var value of myArray) {
console.log(value);
}

```
5、filter遍历
```
//不会改变原始数组，返回新数组
var arr = [
  { id: 1, text: 'aa', done: true },
  { id: 2, text: 'bb', done: false }
]
console.log(arr.filter(item => item.done))
 
//ES5
 
arr.filter(function (item) {
  return item.done;
});
 
var arr = [73,84,56, 22,100]
var newArr = arr.filter(item => item>80)   //得到新数组 [84, 100]
console.log(newArr,arr)

```
6、every遍历
```
//every()是对数组中的每一项运行给定函数，如果该函数对每一项返回true,则返回true。
 
var arr = [ 1, 2, 3, 4, 5, 6 ];
console.log( arr.every( function( item, index, array ){
        return item > 3;
    }));
结果：false

```
7、some遍历
```
//some()是对数组中每一项运行指定函数，如果该函数对任一项返回true，则返回true。
 
var arr = [ 1, 2, 3, 4, 5, 6 ];
    
    console.log( arr.some( function( item, index, array ){
        return item > 3;
    }));
true

```
8、find()
```
//find()方法返回数组中符合测试函数条件的第一个元素。否则返回undefined
 
var stu = [
    {
        name: '张三',
        gender: '男',
        age: 20
    },
    {
        name: '王小毛',
        gender: '男',
        age: 20
    },
    {
        name: '李四',
        gender: '男',
        age: 20
    }
]
 
function getStu(element){
   return element.name == '李四'
}
  
stu.find(getStu)
//返回结果为
//{name: "李四", gender: "男", age: 20}

```
9、findIndex
```
//对于数组中的每个元素，findIndex 方法都会调用一次回调函数（采用升序索引顺序），直到有元素返回 true。
//只要有一个元素返回 true，findIndex 立即返回该返回 true 的元素的索引值
//如果数组中没有任何元素返回 true，则 findIndex 返回 -1。
//findIndex 不会改变数组对象。
 
[1,2,3].findIndex(function(x) { x == 2; });
// Returns an index value of 1.
 
[1,2,3].findIndex(x => x == 4);
// Returns an index value of -1.

```
10、keys，values，entries
```
//ES6 提供三个新的方法 —— entries()，keys()和values() —— 用于遍历数组。
//它们都返回一个遍历器对象，可以用for...of循环进行遍历，唯一的区别是keys()是对键名的遍历、values()是对键值的遍历，entries()是对键值对的遍历
 
for (let index of ['a', 'b'].keys()) {
console.log(index);
}
// 0
// 1
for (let elem of ['a', 'b'].values()) {
console.log(elem);
}
// 'a'
// 'b'
for (let [index, elem] of ['a', 'b'].entries()) {
console.log(index, elem);
}
// 0 "a"
// 1 "b"

```

## 数组中map forEach区别？
### 相同点
1、都是循环遍历数组中的每一项
2、forEach map 每次执行匿名函数都支持3个参数 参数分别是 item(当前的每一项)index(索引值)arr(原数组)
### 不同点
#### map
1、map方法返回一个新的数组 数组中的元素为原始数组调用函数处理后的值；
2、map不会对空数组进行检测 map不会改变原始数组；
#### forEach
1、forEach方法用来调用数组的每个元素 将元素传给回调函数；
2、forEach对于空数组是不会调用回调函数的 无论arr是不是空数组，forEach返回的都是 undefied 这个方法只有将数组中的每一项作为callback的参数执行一次； 

## 数组中 map 和 forEach 的区别？
### 相同点 
1、都是循环遍历数组中的每一项；
2、forEach 和 map 方法里每次执行匿名函数都支持三个参数 参数分别是item(当前每一项),index(索引值),arr(原数组)
### 不同
1、map 方法返回一个新的数组， 数组中的元素为原始数组调用函数处理后的值；
2、map 方法不会对空数组进行检测，map方法不会改变原始数组；
3、forEac方法用来调用数组的每个元素 将元素传给回调函数；
4、forEach对于空数组不会调用回调函数；无论arr是不是空数组，forEach返回的都是undefined 这个方法只是将数组中的每一项作为callback的参数执行一次。

## 箭头函数和普通函数之间的区别
1、箭头函数没有prototype属性
2、箭头函数的this指向定义时外层第一个普通函数的this
3、不能直接修改箭头函数的this；
4、当箭头函数外层没有普通函数时，它的this在严格和非严格模式都是指向window；
5、箭头函数没有外层函数直接使用arguments会报错；
6、箭头函数有外层函数时，arguments继承自外层函数的arguments；
7、使用new调用箭头函数会报错；
8、箭头函数没有外层函数时，new.target会报错；
9、箭头函数不支持重名参数；
10、箭头函数语法更具优雅；
## this指向
1、对象中的this 指向该对象
2、构造函数中的this 指向实例化对象
3、事件函数中的this 代表触发事件函数的元素对象
4、箭头函数中的this 始终指向函数声明时所在作用域的this的值
5、匿名函数中的this 都指向window

## call apply bind 三者的区别？
### 相同点
bind、apply、call 都是用来绑定函数执行时this的指向（改变函数执行时的上下文），同时还可以传参，调用它们的对象必须是一个函数 Function。
### 不同点
call() 接受的是若干个参数的列表
apply()接受的是一个包含多个参数的数组
bind()方法的返回值是函数，需要手动调用才会执行，而 apply 和 call 则是立即调用。

## new 操作符 具体步骤？
第一步：创建一个新对象。
第二步：将构造函数的作用域赋给新对象（因此this就指向了新对象）
第三步：执行构造函数中的代码（为这个新对象添加属性）
第四部：返回新对象

## for in 和 for of 的区别？
1、循环对象属性的时候用 for in ,在遍历对象的时候用for of
2、 for..in 循环出来的是key for of 循环的是value

## js中的继承
1、原型继承
2、借用构造函数继承
3、组合继承
4、型式继承
5、寄生式继承
6、寄生组合式继承