javascript的常识原创
JavaScript常识
let const var的区别
- var声明的变量 是函数作用域
- let声明的变量 是块级作用域 不可重复声明
- const声明的常量 是块级作用域 不可重复声明 必须初始化
变量提升的本质
- 编译阶段会收集当前上下文中的var声明的变量和函数,将其添加到上下文对象
- 且会进行初始化,变量的访问正是通过上下文对象,以及由其构成的作用域链
- 因此代码执行过程中,在变量声明之前依然可以在全局对象中访问到。
- let和const声明的变量虽然被添加了但没有被初始化,因此形成了暂时性死区
Js的数据类型和区别
- 基本数据类型 使用typeof来判断
- string
- number
- boolean
- null
- undefined
- symbol
- bigint
- 引用数据类型 使用instanceof来判断
- object
- function
- array
- Math
- Date
- RegExp
object.assign
- 接收两个参数 target 和 sources
- 合并到target并返回target
- 浅拷贝
constructor
- 构造函数的显式原型对象中的一个内部属性,指向构造函数
- 当我们改变构造函数的原型时,新原型对象中的constructor不在指向构造函数
map和forEach
- map遍历数组,并保留每次的操作结果,将其作为新数组的元素返回
- forEach遍历数组,并每次操作的是原数组,不返回值,不可使用return来打断
forof可迭代的对象
- map
- set
- array
- string
- arguments
arguments和rest
- 常规函数中参数收集arguments
- 箭头函数中参数收集rest
null和undefined的区别
- null表示空值,undefined表示原始值
- typeof检测null返回object是由于typeof的检测原理是所有二进制前三位为0的会被判定为object,而null刚好是。
WeakMap WeakSet的区别
区别 | Set | WeakSet | Map | WeakMap |
键 | 无 | 无 | 任意 | 对象 |
值 | 任意 | 对象 | 任意 | 任意 |
是否可迭代 | 是 | 否 | 是 | 否 |
用途 | 存储唯一值 | 保存DOM结点 | 数据转换 | 标识DOM |
- Weak表示弱引用,即如果所保存的对象没有其他对象引用则会被进行垃圾回收
- 都没有遍历方法,因为弱引用随时可能会被回收。
Js的内存泄漏
- 闭包:导致私有变量生命周期延长
- 定时器:变量引用无法回收
- DOM引用:变量引用无法回收
- 事件监听:变量引用无法回收
- 意外的全局变量:作用域扩大
事件循环机制
- js单线程导致事件处理只能按序执行
- 一旦某个时间处理时间过长则会导致阻塞
- 因此将异步事件交给其他线程处理,将回调放入队列等待主线程执行
- 异步任务分为宏任务和微任务
- 先执行同步任务,将遇到的所有微任务和宏任务都放到队列中
- 同步任务执行完毕,再去执行微任务,最后执行宏任务
- 常见的微任务由precess.nexttick,promise.then,和await之后的语句。
Js类型判断的方法
- typeof基本类型判断,除了null
- instanceof 引用类型判断
- constauctor 引用类型判断
继承方式
- 原型链继承:通过设置子类原型为父类原型的实例实现原型方法的继承
- 构造函数继承:通过盗用父类构造函数,实现实例属性的继承
- 组合继承:结合构造函数和原型链继承实现方法和属性的继承
- 原型式继承:继承不具有类型的对象身上的属性和方法
- 寄生式继承:在原型式继承的基础上扩展自身的属性和方法
- 寄生组合式继承:通过原型式继承来继承方法,通过盗用构造函数继承实例
文件引入方式
- H5原生支持link,除了样式文件还可以是图片等资源文件,与文档同时加载
- CSS3原生支持import,只能引入样式,且必须在文档加载完毕才去加载
href和src的区别
- href用于定义当前文档与外部文件的关系
- src将外部资源加载并嵌入到当前文档中
- 在遇到href属性时,会并行加载,不会影响文档加载,因为其不会被引入处理
- 在遇到scr属性时,会暂停文档的加载,先下载src的资源,如img,script等,因为其会被嵌入到当前文档中。
箭头函数
- 一般用于简化匿名函数的书写
- 没有自己的this,会捕获自己定义时外层执行环境中的this。
- 只有函数或者全局中才配有this
- 定义对象的{}是无法形成单独的执行环境的,没有this
- call,apply,bind无法改变箭头函数的this
- 箭头函数中没有arguments,可以使用...rest来收集
ES6的新特性
- let,const关键字
- 解构赋值
- 箭头函数,rest参数,默认参数,严格模式
- 迭代器
- for-in:自身和继承的可枚举属性(除Symbol)
- Object.keys,Object.values,Object.entries:自身可枚举的键值对
- Object.getOwnPropertyNames:自身所有的属性名
- Set,Map结构
- Proxy,Reflect
- Promise,generator
- class,extends
- ESModule