前端JavaScript面试技巧-笔记

基础知识:
 原型 原型链
 作用域 闭包
 异步 单线程

JS-Web-API：
 DOM操作
 Ajax
 事件绑定

开发环境：
 版本管理
 模块化
 打包工具

运行环境：
 页面渲染
 性能优化

几道面试题

1. JS中使用typeof能得到哪些类型？（考点：JS变量类型）
2. 何时使用（3等号）何时使用==？（考点：强制类型转换）
3. window.onload和DOMContentLoaded的区别？（考点：浏览器渲染过程）
4. 用JS创造10个a标签，点击时弹出对应的序号（考点：作用域）
5. 简述如何实现一个模块加载器，实现类似require.js的基本功能（考点：JS模块化）
6. 实现数组的随机排序（考点：JS基础算法）

变量类型和计算
 题目
 知识点
 解答

题目:

1. JS中使用typeof能得到哪些类型
2. 何时使用(3等号)何时使用==
3. JS中有哪些内置函数
4. JS变量按照存储方式区分为哪些类型，并描述其特点
5. 如何理解JSON

知识点：
 变量类型
 变量计算

变量类型：
 值类型vs引用类型
 typeof运算符详解

值类型：

引用类型：对象、数组、函数

typeof运算符详解

 typeof能够区分值类型，不能区分引用类型
 对象和数组typeof结果都是object，函数是function
 null的结果也是object

变量计算-强制类型转换
 字符拼接
 ==运算符
 if语句
 逻辑运算
字符拼接

==运算符

if语句

逻辑运算

10转换成true，再与上0，结果是0
‘ ’转换成false，在并上’abc’，还是’abc’

问题1：JS中使用typeof能得到哪些类型

问题2：何时使用（3等号）何时使用==

问题3：JS中有哪些内置函数

问题4：JS变量按照存储方式区分为哪些类型，并描述其特点

问题5：如何理解JSON

---

原型和原型链
 题目
 知识点
 解答

题目：

1. 如何准确判断一个变量是数组类型
2. 写一个原型链继承的例子
3. 描述new一个对象的过程
4. Zepto(或其他框架)源码中是如何使用原型链

知识点：
 构造函数
 构造函数-扩展
 原型规则和示例
 原型链
 instanceof

构造函数
构造函数-扩展

原型规则和示例






原型链

循环对象自身的属性

instanceof
instanceof用于判断引用类型属于哪个构造函数的方法

问题1：如何准确判断一个变量是数组类型

问题2：写一个原型链继承的例子



问题3：描述new一个对象的过程

问题4：Zepto(或其他框架)源码中是如何使用原型链

---

作用域和闭包
 题目
 知识点
 解答

题目：

1. 说一下对变量提升的理解
2. 说明this几种不同的使用场景
3. 创建10个标签，点击的时候弹出来对应的序号
4. 如何理解作用域
5. 实际开发中闭包的作用

知识点：
 执行上下文
 this
 作用域
 作用域链
 闭包

执行上下文


this
this要在执行时才能确认值，定义时无法确定


作为构造函数执行

作为对象属性执行

作为普通函数执行

call apply bind

作用域


作用域链


闭包

问题1：说一下对变量提升的理解

问题2：说明this几种不同的使用场景

问题3：创建10个标签，点击的时候弹出来对应的序号

For循环结束后，开始监听事件，这里alert(i)中的i是自由变量，到其父作用域中找，此时i=10.所以点击弹出来的都是10.

问题4：如何理解作用域

问题5：实际开发中闭包的作用

_list不会被外部随意修改

---

异步和单线程
 题目
 知识点
 解答

题目：

1. 同步和异步的区别是什么？分别举一个同步和异步的例子
2. 一个关于setTimeout的笔试题
3. 前端使用异步的场景有哪些

知识点：
 什么是异步（对比同步）
 前端使用异步的场景
 异步和单线程

什么是异步（对比同步）


前端使用异步的场景

异步和单线程

问题1：同步和异步的区别是什么？分别举一个同步和异步的例子

问题2：一个关于setTimeout的笔试题

1，3，5，2，4
问题3：前端使用异步的场景有哪些

---

其他知识
 题目
 知识点
 解答

题目

1. 获取2017-06-10格式的日期
2. 获取随机数，要求长度一致的字符串格式
3. 写一个能遍历对象和数组的通用forEach函数

知识点
 日期
 Math
 数组API
 对象API

日期

Math

数组API

对象API

问题1：获取2017-06-10格式的日期

问题2：获取随机数，要求长度一致的字符串格式

问题3：写一个能遍历对象和数组的通用forEach函数

---

JS-Web-API

DOM操作
Document Object Model
 题目
 知识点
 解答

题目：

1. DOM是哪种基本的数据结构？
2. DOM操作的常用API有哪些？
3. DOM节点的attr和property有何区别？

知识点：
 DOM本质
 DOM节点操作
 DOM结构操作

DOM本质

DOM节点操作




DOM结构操作




问题1：DOM是哪种基本的数据结构？

问题2：DOM操作的常用API有哪些？

问题3：DOM节点的attr和property有何区别？

---

BOM操作
Browser Object Model
 题目
 知识点
 解答

题目：

1. 如何检测浏览器的类型
2. 拆解url的个部分

知识点：
 Navigator
 Screen
 Location
 History

问题1：如何检测浏览器的类型

问题2：拆解url的个部分

---

事件

 题目
 知识点
 解答

题目：

1. 编写一个通用的事件监听函数
2. 描述事件冒泡流程
3. 对于一个无限下拉加载图片的页面，如何给每个图片绑定事件

知识点：
 通用事件绑定
 事件冒泡
 代理

通用事件绑定



事件冒泡

代理

问题1：编写一个通用的事件监听函数

问题2：描述事件冒泡流程

问题3：对于一个无限下拉加载图片的页面，如何给每个图片绑定事件

---

Ajax
 题目
 知识点
 解答

题目：

1. 手动编写一个ajax，不依赖第三方库
2. 跨域的几种实现方式

知识点：
 XMLHttpRequest
 状态码说明
 跨域

XMLHttpRequest

状态码说明


跨域
 什么是跨域
 JSONP
 服务器端设置http header
什么是跨域

JSONP

服务器端设置http header

手动编写一个ajax，不依赖第三方库

跨域的几种实现方式

---

存储

 题目
 知识点
 解答

题目

知识点





关于开发环境

---

模块化

本身就是一个面试的题目

运行环境

页面加载过程
 题目
 知识点
 解答
题目

知识点










解答

性能优化

几个示例

安全性






简历