【面试题】js面试题整理

1、js数据类型

• 基本数据类型：undefined、null、number、boolean、string、symbol
• 引用数据类型：object(function、array、date )

2、js数据类型的转换

• 转换为布尔值-Boolean()
• 转换为数字-Number() parseInt() parseFloat()
• 转换为字符串-String() toString()
• null和undefined没有.toString()方法

3、js数据类型的判断

• typeof：对于原始数据类型来说，除了null都可以显示正确的类型— type 2
• instanceof：可以正确的判断对象的类型— a instanceof Number
• constructor：如果更改原型就会变得不可靠
• Object.prototype.toString.call() 使用object对象的原型方法toString，使用call来借用Object的toString方法

const c = Object.prototype.toString
c.call(2) "[object Number]"
c.call(null) "[object Null]"
c.call('1222') "[object String]"

4、null和undefined区别

null和undefined都代表空，都是基本数据类型；
区别：

1. null可以作为变量的初始值；
2. null是原型链的尽头；
3. 变量没有的属性会返回undefined；
4. 函数没有返回值会返回undefined；
5. 变量已声明未赋值返回undefined;

5、{}和[]valueOf和toString结果是什么

const obj = {};
obj.valueOf()   {}
obj.toString()   "[object Object]"
const arr = [];
arr.valueOf()   []
arr.toString()   ""

6、javascript的作用域和作用域链

• 作用域：作用域是定义变量的区域，他有一套访问变量的规则，这套规则用来来管理浏览器引擎如何在当前作用域以及嵌套的作用域中根据变量进行变量查找；
• 作用域链：作用域链的作用是保证对执行环境有权访问的所有变量和函数的有序访问，通过作用域链，我们可以访问到外层环境的变量和函数，当我们查找一个变量是，如果当前执行环境中没有找到，他就会顺着作用域链向后查找
• 作用域链的本质是一个指向变量对象的指针列表。变量对象是一个包含了执行环境中所有变量和函数的对象。作用域链的前端始终都是当前执行上下文的变量对象。全局执行上下文的变量对象始终是作用域链的最后一个对象。

7、谈谈对this的理解

• 全局的this指向window；
• 构造函数中的this指向实例出来的对象；
• 对象中的方法指向该方法所属的对象；
• 事件当中的this指向当前绑定的元素；
• 定时器中的this指向window。

8、箭头函数和普通函数的区别

• 箭头函数使用箭头定义，普通函数没有
• 箭头函数不能用于构造函数，不能使用new，普通函数可以用于构造函数；
• 箭头函数的this永远指向其上下文的this，不能改变this；普通函数的this指向调用它的对象，可以改变；
• 箭头函数不能使用argument对象存储实参，可以使用扩展运算符；普通函数可以使用argument存储实参；

8、call、apply、bind的理解

相同点：

• 都可以用来改变this指向；
• 接收的第一个参数都是this指向的对象；
• 都可以通过后续参数来传参

不同点：

• call和bind传参相同，后续参数依次传入；apply第二个参数为数组；
• call和apply都是立即调用函数，bind是返回一个修改this后的函数；

9、什么是闭包，为什么要使用它

• 闭包是指有权访问另一个函数作用域内变量的函数，创建闭包的最常见方式就是在一个函数内部创建另一个函数，创建的函数可以访问到当前函数的局部变量
• 闭包的用途：
  1）使我们在函数外部能够访问到函数内部的变量。通过使用闭包，我们通过在外部调用闭包函数，从而在外部访问到函数内部的变量，可以使用这种方法来创建私有变量；
  2）函数的另一个用途是使已经运行结束的函数上下文中的变量对象继续留在内存中。因为闭包函数保留了这个变量对象的引用，所以这个变量对象不会被回收

  const a = () => {
    var n = 0;
    return function add() {
      n++;
      console.log(n);
    }
  }
  const b = a();
  b(); // 1
  b(); // 2

9、什么是闭包，为什么要使用它

• 闭包要满足四个条件：1）有函数嵌套 2）内部引用函数外层作用域的变量 3）返回值是函数 4）创建一个对象函数，让其长期驻足
• 为什么使用它：因为全局变量容易污染环境，而局部变量又无法长期驻留内存，于是我们需要一种机制，既能长期保存变量又不污染环境，这就是闭包。

10、Dom和Bom

• Dom指的是文档对象模型，这个对象主要定义了处理网页内容方法的内容；
• Bom指的是浏览器对象模型，这个对象主要定义了与浏览器进行交互的方法和核心，Bom的核心是window，window对象含有location对象，navigator对象、screen对象，并且Dom的最根本对象document对象也是Bom的window对象的子对象

11、事件委托

• 事件委托本质上是利用了浏览器事件冒泡的机制，因此可以把子节点的监听函数定义在父节点上，由父节点的监听函数统一处理多个子元素的事件，这种方式就叫做事件代理；
• 不必要为每一个子元素都绑定一个监听事件，减少内存消耗；
• 可以动态的添加dom

12、事件传播

• 当事件发生在dom元素上，该事件并不完全发生在那个元素上；
• 事件传播有三个阶段：
  1）捕获阶段-事件从window开始，然后向下到每个元素，直到到达目标元素；
  2）目标阶段-事件已达到目标元素；
  3）冒泡阶段-事件从目标元素冒泡，然后上升到每个元素，直到window。

13、常用的正则表达式

//（1）匹配 16 进制颜色值 
var color = /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})/g; 

//（2）匹配日期，如 yyyy-mm-dd 格式 
var date = /^[0-9]{4}-(0[1-9]|1[0-2])-(0[1-9]|[12][0-9]|3[01])$/; 

//（3）匹配 qq 号 
var qq = /^[1-9][0-9]{4,10}$/g;
 
//（4）手机号码正则 
var phone = /^1[34578]\d{9}$/g; 

//（5）用户名正则 
var username = /^[a-zA-Z\$][a-zA-Z0-9_\$]{4,16}$/; 

//（6）Email正则 
var email = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/; 

//（7）身份证号（18位）正则 
var cP = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/; 

//（8）URL正则 
var urlP= /^((https?|ftp|file):\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?$/; 

// (9)ipv4地址正则 
var ipP = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/; 

// (10)车牌号正则 
var cPattern = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/;
 
// (11)强密码(必须包含大小写字母和数字的组合，不能使用特殊字符，长度在8-10之间)
var pwd = /^(?=.\d)(?=.[a-z])(?=.[A-Z]).{8,10}$/

// (12) 6位数的验证码
var pwd = /^\d{6}$/

15、forEach（）和map（）的区别

16 for…in…和for…of…的区别

• for…in遍历出来的是key，for…of遍历出来的是value；
• 所以一般用for…in遍历对象，用for…of遍历数组；

17 async…await和promise的区别

• 两者都是处理异步请求；
• async/await寄生于Promise，await后面跟一个promise对象；
• promise是链式调用，async/await将异步转换为同步；
• promise有三种状态：pending、fulfilled、rejected，只有异步操作的结果可以决定当前是哪一种状态，任何操作都不能改变这个状态；

18 require和import的区别

import 和 require 都是在 JavaScript 中用来导入模块的命令:

• require 是 CommonJS 模块的语法；import 是 ES)模块的语法。
• irequire 是运行时加载，所以可以放在文件的任何地方；import 是编译时加载，只能放在文件头部。
• -使用 import 可以很容易地将一个模块中的多个部分分别导入到当前模块中，而使用 require 只能将整个模块导入。