h5前端零碎面试题

1.Async函数用法和promise区别

答：简单的说async函数就相当于自执行的Generator函数，相当于自带一个状态机，在await的部分等待返回， 返回后自动执行下一步。而且相较于Promise,async的优越性就是把每次异步返回的结果从then中拿到最外层的方法中，不需要链式调用，只要用同步的写法就可以了。更加直观而且，更适合处理并发调用的问题。但是async必须以一个Promise对象开始 ，所以async通常是和Promise结合使用的。总的来说，async函数主要就是为了解决异步的并发调用使用的 ，直接将参数从then里取出来，相比promise的链式调用，传参更加方便，异步顺序更加清晰。

2.Extends继承和js5核心区别？

答：这道题面试官考查的是你对Es5与ES6继承的理解，它俩的区别主要集中在以下几点：

（1）ES5的继承实质上是先创建子类的实例对象，然后再将父类的方法添加到this上（Parent.apply(this)）.

(2)ES6的继承机制完全不同，实质上是先创建父类的实例对象this（所以必须先调用父类的super()方法），然后再用子类的构造函数修改this。

(3)ES5的继承时通过原型或构造函数机制来实现。

(4)ES6通过class关键字定义类，里面有构造方法，类之间通过extends关键字实现继承。子类必须在constructor方法中调用super方法，否则新建实例报错。因为子类没有自己的this对象，而是继承了父类的this对象，然后对其进行加工。如果不调用super方法，子类得不到this对象。

3.Js中如何处理同步和异步的

答：同步的话代码依次执行，异步的处理方式有：（1）回调函数 （2）promise  (3)Generator  (4)Async/await (5)定时器函数 （6）ajax等

4.说说你对spa单页面应用的理解

SPA（ single-page application ）仅在 Web 页面初始化时加载相应的 HTML、JavaScript 和 CSS。一旦页面加载完成，SPA 不会因为用户的操作而进行页面的重新加载或跳转；取而代之的是利用路由机制实现 HTML 内容的变换，UI 与用户的交互，避免页面的重新加载。
优点：
• 用户体验好、快，内容的改变不需要重新加载整个页面，避免了不必要的跳转和重复渲染；
• 基于上面一点，SPA 相对对服务器压力小；
• 前后端职责分离，架构清晰，前端进行交互逻辑，后端负责数据处理；
缺点：
• 初次加载耗时多：为实现单页 Web 应用功能及显示效果，需要在加载页面的时候将 JavaScript、CSS 统一加载，部分页面按需加载；
• 前进后退路由管理：由于单页应用在一个页面中显示所有的内容，所以不能使用浏览器的前进后退功能，所有的页面切换需要自己建立堆栈管理；
• SEO 难度较大：由于所有的内容都在一个页面中动态替换显示，所以在 SEO 上其有着天然的弱势。

5.有一串手机号，我想把中间的四位替换成****，我要用什么方法实现？

答：利用正则表达式：

var tel = 15617076160;

tel = "" + tel;

var reg=/(\d{3})\d{4}(\d{4})/;

var newTel = tel.replace(reg, "$1****$2")；

console.log(newTel);//156****6160

6.new一个关键字做了哪些事情

答：使用 new 操作符。以这种方式调用构造函数实际上会经历以下4个步骤：

(1) 创建一个新对象；

(2) 将构造函数的作用域赋给新对象（因此 this 就指向了这个新对象）；

(3) 执行构造函数中的代码（为这个新对象添加属性）；

(4) 返回新对象。

7.我声明了一个构造函数，调用的时候  我写new 和没有写new有什么区别？

答:任何函数，如果不通过 new 操作符来调用，就是直接执行函数体。

如果使用 new调用，则不单执行函数，还会返回个实例对象。以这种方式调用构造函数实际上会经历以下4个步骤：

(1) 创建一个新对象；

(2) 将构造函数的作用域赋给新对象（因此 this 就指向了这个新对象）；

(3) 执行构造函数中的代码（为这个新对象添加属性）；

(4) 返回新对象。

8.前端调试bug都有哪些方法

答：

1.断点调试

2.console.log调试

3.检测dom事件执行顺序

4.打开控制台CSS调试

9.怎么阻止冒泡和浏览器默认事件

答：标准浏览器:  阻止冒泡e.stopPropagation() 阻止默认事件e.preventDefault()

    ie浏览器:  阻止冒泡e.cancleBubble=true 阻止默认事件e.returnValue = fasle;

10.js延迟加载都有哪些方式

答：JS延迟加载，也就是等页面加载完成之后再加载 JavaScript 文件。

1.script标签中加入defer属性

2.script标签中加入async属性

3.动态创建dom的方法

4.使用jQuery的getScript方法

5.setTimeout

6.最后 引入js