js高频面试题（高频）

喜欢ヅ旅行 2023-01-10 14:33 174阅读 0赞

# 题目 #

1.  js基本数据类型
2.  闭包是什么，写一个简单的闭包
3.  原型和原型链
4.  作用域
5.  this
6.  call、apply和bind
7.  ajax基本步骤以及readyState的五种状态
8.  promise用过吗？作用是什么？它的基本步骤
9.  get和post区别
10. 继承有哪些方式
11. 浅拷贝深拷贝
12. 数组和字符串方法有哪些

# 答案 #

## **1. js基本数据类型** ##

基本数据类型：number，string，boolean,null,undefined,symbol  
引用类型（对象）:数组、日期、正则、函数

## **2. 闭包是什么，写一个简单的闭包** ##

闭包指的是函数内部的函数，它有权去访问另一个函数内部的变量,当查找一个自由变量时，在函数定义的地方查找而不是函数执行的地方，闭包延展了局部变量的生命周期，使得外部操作局部变量成为可能，一般来讲函数在调用执行后函数就会被释放，但如果函数中产生了闭包，就会导致函数执行完毕后，函数内部的局部变量没有被释放，使得占用内存时间会变长，容易造成内存泄漏。

function outer(){ 
    let n = 0;
      function inner(){ 
      let m = 2;
      alert(m+n);
      }
    }
    outer();

function print(fn){ 
     const a = 200;
     fn();
    }
    const a = 100;
    function fn(){ 
       console.log(a);
    }
    print(fn);

## **3. 原型和原型链** ##

js中有两种原型，一种是显式原型prototype（又称为函数原型，只有函数才有），另一种叫做隐式原型\_proto\_（又称为对象原型）.

*  prototype保存着实例共享的方法，有一个指针constructor会指回构造函数
 *  \_proto\_用于指向创建这个对象的函数的prototype，假如需要获取这个对象的属性或方法时，先在自身属性或方法上查找，假如找不到就会通过\_proto\_向上寻找，由此形成原型链

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mjg5ODMxNQ_size_16_color_FFFFFF_t_70]

## **4. 作用域** ##

一个变量可以使用/生效的范围，包括：全局作用域、函数作用域、块级作用域。  
全局作用域指的是window，函数作用域指的是函数，块级作用域指的是有花括号的地方

## **5. this** ##

*  作为普通函数调用 =>返回window
 *  使用call、apply、bind调用 =>传什么绑定什么
 *  作为对象方法调用=>返回对象本身
 *  在class方法中调用=>返回当前实例本身

## **6. call、apply和bind** ##

改变this指向，call和apply传参形式不一样，call传入一个个参数，apply传入一个数组，bind只有在调用时才会生效。

## **7. ajax基本步骤以及readyState的五种状态** ##

//1创建对象xmlhttprequest
    const xhr = new XMLHTTPRequest();
    //2创建一个http请求初始化
    xhr.open('GET','/api',false);
    //3send发送请求
    xhr.send();
    //4监听状态变化
    xhr.onreadystatechange = function(){ 
     //5查看状态码判断状态
     if(xhr.readyState == 4){ 
       if(xhr.status >= 200 &&xhr.status <= 300){ 
       }
     }
    }

readyState：

*  未初始化0
 *  正在载入1
 *  载入完成2
 *  开始解析3
 *  解析完成4

## **8. promise用过吗？作用是什么？它的基本步骤** ##

promise是用来解决回调地狱的回调问题而产生的，是进行异步编程的新的解决方案  
执行步骤：

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mjg5ODMxNQ_size_16_color_FFFFFF_t_70 1]基本编码流程：

//1创建promise对象
    const p = new Promise((resolve,reject)=>{ 
    //2启动异步任务
    setTimeout(() =>{ 
      const time = Date.now()
    //3根据处理结果做不同处理
    //3.1如果成功，调用resolve（），指定成功的value
    if(time % 2 ===1){ 
      resolve('成功的值' + time)
    }else{ 
    //3.2如果失败，调用reject（），指定失败的reason
      reject('失败的值' + time)
      }
    },2000)
    })
    
    //4promise指定成功或失败的回调函数来获取成功的value或失败的reason
    p.then(
      value =>{ 
       //成功的回调函数onResolved，得到成功的value
         console.log('成功的value',value);
      },
      reason =>{ 
      //失败的回调函数onRejected，得到失败的reason
          console.log('失败的reason',reason);
      }

## **9. get和post区别** ##

1.  get一般用于获取请求，post一般用于提交请求
2.  get倾向于放在url中，post倾向于放在body体内
3.  从根本上来说两种请求方式都不够安全，因为http本身就是明文协议，所以安全的普遍做法是采用https密钥加密协议。而由于get是放在请求体内，所以相对来说比较安全的做法是采用post+body的做法
4.  get数据的长度限制其实是指url的长度限制，但http协议本身其实对url的长度并未做任何限定，实际的限制是由客户端/浏览器以及服务器限定的

## **10. 继承有哪些方式** ##

原型链继承、构造函数继承、组合继承、原型式继承、寄生式继承、寄生组合继承

## **11.浅拷贝深拷贝** ##

[不懂的可以看这篇][Link 1]  
浅拷贝基本数据类型拷贝的是值，引用类型拷贝的是地址，因此当值是引用类型时，新创建的值如果发送变化，那么指针指向的内容也就发送变化，因此原来的值也就改变。  
浅拷贝方法有：

*  object.assign
 *  扩展运算符let cloneObj = \{…obj\}
 *  concat运算符
 *  slice拷贝数组
 *  手工实现

深拷贝指的是在内存中开辟一个新的空间，用来存放拷贝过来的值，新创建的值改变，不会影响到原有的值（因为它们不属于同一个地址）  
深拷贝方法：JSON.stringfy、手写递归实现

## 数组和字符串方法有哪些 ##

**数组方法：**  
push，pop，shift，unshift，join，sort，concat，splice，slice  
**字符串方法**  
split，replace，concat，trim，indexOf，lastIndexOf，substr（提取字符串，可以规定被提取的长度），search（搜索特定的值，返回其位置）  
**数组遍历**  
for循环，for each，for of，for in

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mjg5ODMxNQ_size_16_color_FFFFFF_t_70]: /images/20221119/256dcb8a43ec4d76ba713216aafa5b3d.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mjg5ODMxNQ_size_16_color_FFFFFF_t_70 1]: /images/20221119/52865ebf03cd40da8cbaf97e6832bea0.png
[Link 1]: https://blog.csdn.net/weixin_42898315/article/details/112604799