前端js基础知识(js前端面试题总结及答案)

导语：前端必会的js基本知识总结（面试篇）

前端必会的js基本知识总结，通常在面试中被问到

学会以下知识点，会给你的面试加分的喔

1、JavaScript中关键字this的作用尤为重要

随着使用场景不同

this的指向会发生变化

例如:

<script>  // 全局作用域，this指向Window  console.log(this === window);// 打印true  // 在方法函数内部，this指向这个函数本身  function fn(){    return this;  }  console.log(fn() === window);// 打印true</script>

<script>  // 标签绑定点击事件，内部this指向本身  let span = document.querySelector(&39;);  span.onclick = function(){    console.log(this);  }</script>

<script>  // 一个构造函数中this指向函数本身，this.xxx指向函数内部属性  function change(name,type){    console.log(this);    this.name = name;    this.val = type;  }  change(&39;,&39;);  // 打印如下图</script>

<script>  let obj = {    fn1(){      console.log(this);    },    fn2(){      console.log(this);    }  }  obj.fn1();  obj.fn2();  // 打印的this指向obj对象中每个方法函数本身</script>

2、JavaScript异步执行和同步执行

js同步执行和异步执行差别在于

同步执行指，在主线程中每个任务排队执行，只有前一个任务执行完毕时，后面的任务才能执行，如果一个任务执行时间过长，那么后面的任务就只能耐心等待

异步执行指，在主线程之外生成一个任务队列，队列中每个任务开始运算，只要有了运行结果，就会在任务队列中放置一个事件，主线程中所有同步任务执行完之后，会读取任务队列中的事件，带到主线程中执行，执行完毕后会再向任务队列读取事件往复操作

3、JavaScript面向对象编程思想

3.1什么是面向对象？

面向对象是一种编程开发思想，俗称万物皆对象

面向对象具有封装性、继承性、多态性的特点

多态性是强类型语言中面向对象拥有的特点，因为JavaScript是弱类型语言，所以不支持多态性

3.2什么是字面量？

字面量指，用最直观的方式来创建对象，例如：

// Object对象var boy = {  name : ,  age : 3}// Array数组对象var arr = [1,2,3];

3.3构造函数创建对象

// new一个方法函数var boy = new Object();boy.name = &39;;boy.age = 3;boy.eat = function(){  console.log(&39;);}boy.eat();// 打印&39;

3.4工厂模式创建对象

function creatBoy(name,age){ return {   name:name,   age:age,   eat:function(){     console.log(this.name + );   } }}// 创建boy实例var boyNumberOne = creatBoy(,3);var boyNumberTwo = creatBoy(,6);boyNumberOne.eat();// 打印

3.5自定义构造函数模式创建对象

function CreatBoy(name,age){  this.name = name;  this.age = age;  this.eat = function(){    console.log(this.name + );  }}var boyNumberOne = new CreatBoy(,3);boyNumberOne.eat();// 打印，注意函数名首字母要大写，比较规范点

更好的创建对象方法是对象封装

把每个方法函数单独提出去，每个页面进行外部引入，避免造成资源浪费，效率会更高

4、原型

JavaScript中每个构造函数都有一个prototype属性指向另外一个对象，这个对象中所有的属性和方法，都会被构造函数创建的实例对象继承，名为原型对象

原型的作用是把所有对象实例需要的属性和方法直接定义在prototype上，达到数据共享，例如：

function CreatBoy(name,age){  this.name = name;  this.age = age;}CreatBoy.prototype.sex = ;CreatBoy.prototype.eat = function(){  console.log(this.name + );}var boy1 = new CreatBoy(name,age);console.log(boy1);// 打印对象如下图boy1.eat();// 打印

4.1面向对象继承性

面向对象继承性指实例对象从prototype中找到属性和方法可以直接使用

通过构造函数创建的对象，都会自带一个__proto__属性，此属性指向构造函数的prototype原型对象

prototype为显式原型对象，__proto__为隐式原型对象，它们指向同一个构造函数

4.2原型链

原型链查找原则是沿着__proto__一直往上找

现在自身层查找 => __proto__查找 => 对象的prototype查找，如果再找不到，那就真是找不到了

5、函数闭包

什么是函数闭包？

函数闭包指，当一个内部函数被调用，就会形成闭包

闭包就是能够读取其他函数内部变量的函数

外界无法访问闭包内部的数据

如果在闭包内声明变量

外界是无法访问的

除非闭包主动向外界提供访问接口

普通方法函数在执行完之后会被系统回收

但对于闭包来讲，当外部函数调用这个闭包时，这个闭包会一直留在内存中

如果闭包过多，会导致内存溢出

本文内容由快快网络小馨创作整理编辑！