面前整理

138 阅读3分钟

1:关于箭头函数

1: 函数体内的this对象就是定义时所在的对象,而不是运行时所在的对象
2:不可以当作构造函数 不能使用new命令 会报错
3: 没有arguments对象,用rest替代
4:不可以使用yied命令,因此不能用做Generator函数中

var f = () => 5
关于setTimeout的thsi指向问题
结论==>


setTimeout中所执行函数中的this,永远指向window(js单线程??)
var id = 'hehe'
var obj = {
    id: 'liuring',
    func: function(){
        setTimeout(function(){console.log(this.id)}, 1000)
    }


}
obj.func()

(1)箭头函数可以让setTimeout中的this,绑定定义时所在的作用域,而不是指向运行时所在的作用域
(2) 箭头函数可以让this的指向固定化,非常适合封装会调函数
(3) 实际是因为箭头函数根本就没有 this,导致内部的this就是外层代码块的this

js 文件的执行顺序
defer && async 
async => js文件加载完 会立即执行
defer => 等所有文件 加载完 文档解析完成 在执行
js单线程 && js事件循环机制 && node事件循环
宏队列: setTimeout setInterval  || ajax请求 || dom事件
微队列 promise nextTick 
微队列优先

js引擎是单线程
还有其他线程
浏览器进程中的线程
渲染 || 网络 || 计时 ||  js执行引擎 || 事件监听 



如何理解js是单线程的 && 同步代码 && 异步代码

js执行引擎只有一个线程,并且不会在执行期间新开启新的线程,而并非浏览器是单线程的

js解释性语言=> 边解释边执行
1:先执行 执行栈中的代码
2: 遇到一些特殊的代码交给浏览器的其他线程处理
3:将执行栈中的代码执行完
4: 从事件队列中取出第一个任务放入执行栈,然后重复

2: promise && await && async

三种状态 pending fulfilled rejected
reject resolve 两种结果
then回调

promise缺点=> 无法取消,一旦新建就会立即执行,无法中途取消

promise 对象 => 构造函数 参数是一个函数

async函数=>返回的是promise对象
generator函数的语法糖

generator函数返回的是Iterator对象

3webpack

webpack 打包工具

loaders
pungins

入口
输出
loader
plugins

模块热替换

关于webpack面试题

1: webpack构建过程
从entry入口文件的module开始递归解析依赖的module
没找到一个module => loader 解析 对应的转换规则

对module进行转换后,再解析出当前module依赖的module




axios拦截器公用部分抽取

基于promise的http库,可以在浏览器和node中

支持请求被then或catch前拦截

4模块

模块
es6的模块 => 静态化 编译时 就能确定依赖关系

5:手写

1: 数组去重
2: 对象深拷贝 浅拷贝
3: url去参数

6:vue相关

虚拟dom
数据双向绑定
vuex 
vue-router
vue的生命周期 && 钩子函数
依赖收集
DOM异步更新策略 nextTick

beforeCreate
created

beforeMount
mounted

beforeUpdate
update

beforeDistroy
distroyed

初始化vue实例对象
dom的挂载 
数据状态


vue生命周期过程

初始化生命周期,事件,
通过Object.defineProperty()设置setter和getter函数,实现响应式和依赖收集
利用mounted 挂载组件
编译
依赖收集

虚拟dom => 对真实DOM的抽象

1: new过程中发生了什么
function Person(name) {
    this.name = name
}
var person1 = new Person('hehe')

rem适配
根结点的font-size

7:闭包