LanguageJavaScript
2020-04-05 20:40:30 6 举报AI智能生成
JavaScript知识图
作者其他创作
大纲/内容
设计模式
Daily Note
数组删除多个元素
1.倒序循环 删除
ES6
let const
临时死区（变量不在提升）
声明不绑定在Windows
在循环中作用域特殊处理
for(在此隐藏单独的作用域){}
for in 与for循环不用
l循环中 let 与 const 不同
模板字符串
箭头函数
this值取决于真实的作用域
不能当构造函数使用
没有 new super 原型等
没有arguments
作为non-method-fucntion
Symbol类型
值通过 Symbol()函数生成 let a = Symbol('a' || {})
参数为对象
调用对象toSting方法
参数为字符串
将字符串作为描述值
即使参数相同 生成的值也不相等(a === a false)
使用Symbol.for 生成的值 是相等的
不能使用new 使用instance of报错
可以作为对象的唯一key
在for in Object.keys() for of 无效
只能通过 Object.getOwnPropertySymbols ()获取
使用Symbol.keyFor()获取使用Symbol.for()生成的实际key
迭代器(for of)
带有Symbol.iterator属性的数据结构
数组
Map结构
迭代器默认结构为 [].entries
Set结构
迭代器默认结构为 [].values
内置迭代器 keys与values 值相同
字符串
类数组
Generator 对象
每次迭代 当前值为对象{done:false,value:xxxx}
内置迭代器
使用对象
数组
Set集合
Map
迭代器种类
Keys()
Values()
Entries()
Class
定义
只是语法糖 大部分功能 都可以用ES5 完成
note
与ES5 的差异
class内部定义的方法，它是不可枚举的 与es5 不同
constructor方法可自定义返回
通过extends关键字实现继承
与ES相同
实例属性必须显示的定义即(this.x = x) 非显示定义的都落在原型上
类本身就指向构造函数 且类型也是函数
都有set get 方法
this问题
this指向实例, 当将类方法提出单独使用时 由于class严格模式 this 为undefined 所以报错
解决this报错 可以使用bind(this) 箭头函数 和proxy 自定义this指向
继承
ES5 的继承，实质是先创造子类的实例对象this，然后再将父类的方法添加到this上面（Parent.apply(this)）。ES6 的继承机制完全不同，实质是先将父类实例对象的属性和方法，加到this上面（所以必须先调用super方法），然后再用子类的构造函数修改this。
静态方法
父类的静态方法可以被子类继承
如果静态方法包含this关键字，这个this指的是类，而不是实例
super
必须在子类调用super() 调用父类的构造函数
super虽然代表了父类A的构造函数，但是返回的是子类B的实例，即super内部的this指的是B的实例，因此super()在这里相当于A.prototype.constructor.call(this)。
super()只能用在子类的构造函数之中
super作为对象时，在普通方法中，指向父类的原型对象 实例中的属性和方法是获取不到的
Set数据结构
值
new Set() 参数为带有iteration属性的数据类型
方法
add
detele =>返回操作结果（true or false）
has=>返回操作结果（true or false）
clear
遍历方法
keys()
values()
entries()
foreach()
WeakMap
值
new WeakMap() 参数只接受对象作为键名
Promise
基本用法
new Promise(function(resovle, rejecet){})
resovle 成功 rejecet 失败
new Promise().then().catch
then(a,b) a成功 b 失败 catch 错误
注意事项
promise 函数内代码立刻执行
多个promise嵌套 状态取决最后一个promis
resolve 或reject 执行完毕 不代表promise 执行完毕
标配then().catch()
内部错误必须使用catch捕获 内部报错不阻断外部代码运行
在node 中 unhandledRejection专门用来捕获位处理的错误(即将废除)
方法
通用属性
返回promise实例(非new的实例)
包含异步操作
都可链式调用
then
参数(a,b)
a 成功回调 b 失败回调
then后的链式调用参数使用上一步then的结果
catch
catch都可以捕获到内部异常
可以在catch内部继续抛错 链式调用catch再捕获
finally
无论promise是什么状态 都会执行
其余方法
all race resolve reject any try allsettled
解决的问题
地狱回调
无法重用
调用栈信息断开
要接入外部变量
Generator
基本属性
yield
只能在generator 函数中使用
在独立的表达式中 以（yield xx）
在表达式右侧 正常 yield xxx
方法
next
控制函数向下执行
next(xx) 传递参数 覆盖上一步next表达式的值
next(xx)控制或修改 函数执行方式与顺序
其他方法
return
throw
模块加载
浏览器端的模块规范
CMD
Sea.js的定义规范
遇到require开始加载，加载后再执行 延迟执行
依赖就近
AMD
require.js的定义规范
依赖前置
提前执行
服务器规范
CommonJS
Node定义规范
同步 加载方式同cmd
ES6
ES6定义规范
同AMD加载一样，先加载再执行
Import 导入的模块 只执行一次，即使应用中多次出现相同导入代码
import 声明与解构相似但实际不相同
const定义类似
单一文件中 只允许一个 export default
导出多个尽量使用 exprot 单个使用export default
差异
Common.js
导出的是值得拷贝，外部无法更改内部值，引用类型除外
导出对象只有运行时才能生成，
Es6
导出值的引用
遇到import生成引用（在代码静态解析时就会生成），脚本运行时取值
ES6编译
Babel编译为类似CommonJS规范的代码
webpack提供方法内置参数加载
其他
为什么浏览器不支持commonJS
浏览器环境中并没有 module、 exports、 require 等环境变量
proxy
note
与Object.defineProperty 类似 单提供的方法多达15种
this问题
proxy 实例可以作为其他对的原型对象
若new Proxy(t,h) t 与h 都为{} 代理实例与t 相通
定义
在目标对象之前架设一层“拦截”，外界对该对象的访问，都必须先通过这层拦截，因此提供了一种机制，可以对外界的访问进行过滤和改写
值
new Proxy(target,handler) (目标对象, 拦截方法)
方法
get set
apply(调用时 call(), aplly() 时拦截)
revocable
使用手册
深入理解
原型与原型链
流程图
作用域与作用域链
bash 采用动态作用域
作用域取决于调用上下文
JS 采用的是静态作用域(词法作用域)
作用域取决于定义的上下文
执行上下文栈
可执行的代码
全局代码
局部(函数)代码
eval代码
重要属性
变量对象
存储了在上下文中定义的变量和函数声明
活动对象 是函数执行时 才在其上下文中创建的变量
作用域链
全局对象是作用域链的最顶端
作用域链的形成在执行上下文时 创建完成
闭包
闭包 = 函数 + 函数能够访问的自由变量
自由变量
指在函数中使用的，但既不是函数参数也不是函数的局部变量的变量。
this
Reference 地描述语言的底层行为逻辑才存在的
base value
referenced name
strict reference
方法 Getbase isPropertyReference
子主题
执行过程
进入执行上下文
给变量对象添加形参、函数声明、变量声明等初始的属性值
进入上下文 只会对上下文中已有的变量对象初始化 对全局或无关联的变量不会做初始化 如果再此上下文中 使用会报错
优先处理方法声明 若有同名变量 也无法更改方法声明 (使用var 声明的变量)
执行代码
再次修改变量对象的属性值
按值传递
函数的参数都是按值传递
基础类型传递的是值的copy
引用类型
共享传递 传递的是值引用的copy
当直接修改参数时 是修改自身的引用不会影响真实引用的值
当修改引用副本的值时，会影响到 真实的引用值
类型转换
Boolean
Boolean() => false
Number
Number(null)=>0
Number(undefined)=>NaN
Number('123W','-0023') NaN -23
Number(undefined)=>NaN
Number('123W','-0023') NaN -23
String
String(NaN) => NaN
String(Infinity) =>Infinity
String(Infinity) =>Infinity
toString
null undefined 无toString()
对象转字符串和数字
toPrimitive(input, type) 根据规则转为原始值
基本类型 调用tostring()
引用类型 使用valueof 再toString()
CSS
flex
自由主题
0 条评论
下一页
