基础知识

  • 判断类型的方法及优缺点
    • typeof 只能判断值类型，不能区分引用类型
    • A instanceOf B 只能判断A是B的实例，不能判断具体属于那种类型
    • toString
    • constructor
  • JS的逻辑运算中，0，NaN，””， null, false, undefined都会判断为false, 其他为true
  • 判断一个变量是否是数组
    • var arr = [];
    • arr instanceOf Array
    • typeof arr // typeof 无法判断数组，结果为object
    • Object.prototype.toString.call(arr) === “[object Array]” // 通用方法
  • readonly 和 disable的区别？
    • Readonly 只针对input(text/password)和textarea有效。而disable对于所有表单元素有效。包括select, redio, checkbox, button
    • 在表单元素使用了disabled后，我们将表单以POST或者GET方式提交的话，这个元素的值不会传递出去，而readonly会将该值传递出去
  • 描述创建一个对象的过程
    • 新生成一个对象
    • 链接到原型
    • 绑定this
    • 返回新对象
  • 变量提升
  • 函数声明和函数表达式区别
  • 作用域链
  • 何时需要异步任务
    • 定时任务 setTimeout, setTimeInterval
    • 网络请求 ajax请求，动态前端开发知识点汇总 - 图1加载
    • 事件绑定
  • 对于一个无限下拉加载图片的页面，如何给每个图片绑定事件
  • 描述事件冒泡流程
  • JavaScript为什么必须是单线程的

  • 什么是event loop （浏览器的事件循环）？

    简单说，就是在程序中设置两个线程：一个负责程序本身的运行，称为”主线程”；另一个负责主线程与其他进程（主要是各种I/O操作）的通信，被称为”Event Loop线程”（可以译为”消息线程”）

    1. 执行全局Script同步代码，这些同步代码有一些是同步语句，有一些是异步语句（比如setTimeout等）；
    2. 全局Script代码执行完毕后，调用栈Stack会清空；
    3. 从微队列microtask queue中取出位于队首的回调任务，放入调用栈Stack中执行，执行完后microtask queue长度减1；
    4. 继续取出位于队首的任务，放入调用栈Stack中执行，以此类推，直到直到把microtask queue中的所有任务都执行完毕。注意，如果在执行microtask的过程中，又产生了microtask，那么会加入到队列的末尾，也会在这个周期被调用执行；
    5. microtask queue中的所有任务都执行完毕，此时microtask queue为空队列，调用栈Stack也为空；
    6. 取出宏队列macrotask queue中位于队首的任务，放入Stack中执行；
    7. 执行完毕后，调用栈Stack为空；
    8. 重复第3-7个步骤；
    9. 重复第3-7个步骤；
  • 什么是宏队列和微队列

宏队列，macrotask，也叫tasks。 一些异步任务的回调会依次进入macro task queue，等待后续被调用，这些异步任务包括：

  • setTimeout
  • setInterval
  • setImmediate (Node独有)
  • requestAnimationFrame (浏览器独有)
  • I/O
  • UI rendering (浏览器独有)

微队列，microtask，也叫jobs。 另一些异步任务的回调会依次进入micro task queue，等待后续被调用，这些异步任务包括：

  • process.nextTick (Node独有)
  • Promise
  • Object.observe
  • MutationObserver

    • 进阶

      vue 核心知识点

react 核心知识点

  1. react的事件机制

React并不是将click事件绑定到了div的真实DOM上，而是在document处监听了所有的事件，当事件发生并且冒泡到document处的时候，React将事件内容封装并交由真正的处理函数运行。这样的方式不仅仅减少了内存的消耗，还能在组件挂在销毁时统一订阅和移除事件。
除此之外，冒泡到document上的事件也不是原生的浏览器事件，而是由react自己实现的合成事件（SyntheticEvent）。因此如果不想要是事件冒泡的话应该调用event.preventDefault()方法，而不是调用event.stopProppagation()方法。
前端开发知识点汇总 - 图2
实现合成事件的目的如下：

  • 合成事件首先抹平了浏览器之间的兼容问题，另外这是一个跨浏览器原生事件包装器，赋予了跨浏览器开发的能力；
  • 对于原生浏览器事件来说，浏览器会给监听器创建一个事件对象。如果你有很多的事件监听，那么就需要分配很多的事件对象，造成高额的内存分配问题。但是对于合成事件来说，有一个事件池专门来管理它们的创建和销毁，当事件需要被使用时，就会从池子中复用对象，事件回调结束后，就会销毁事件对象上的属性，从而便于下次复用事件对象。
  1. React事件和普通的HTML事件的异同？

区别：

  • 对于事件名称命名方式，原生事件为全小写，react 事件采用小驼峰；
  • 对于事件函数处理语法，原生事件为字符串，react 事件为函数；
  • react 事件不能采用 return false 的方式来阻止浏览器的默认行为，而必须要地明确地调用preventDefault()来阻止默认行为
  1. React 组件中怎么做事件代理？它的原理是什么
    在React底层，主要对合成事件做了两件事：
  • 事件委派：React会把所有的事件绑定到结构的最外层，使用统一的事件监听器，这个事件监听器上维持了一个映射来保存所有组件内部事件监听和处理函数。
  • 自动绑定：React组件中，每个方法的上下文都会指向该组件的实例，即自动绑定this为当前组件。

angular 核心知识点

拓展

nodejs