专属的javascript编程规范

数据类型

基本类型

• 数值(number):整数和小数
• 字符串(string):字符或文本
• 布尔值(boolean):true和false
• null:表示空值/undefined:表示未定义或不存在
• Symbol

数值

在js中所有数值类型都是以64位浮点数存储的,也就是说js底层根本没有整数全是小数,所以当涉及计算机无法精确表示的浮点数之间的计算时我们应该小心

类型值

类型值	说明
Infinity	正无穷大
-Infinity	负无穷大
NaN	非数,当将其他类型转换为数值类型而出错时会由此值表示 NaN不等于任何值,包括它本身 它与任何数的运算都为NaN

null和undefined

• 这两个类型几乎没什么区别,甚至我们使用等号判断会得到true的结果,但是为什么要这样设计呢,这也是由于历史原因造成的,js的设计者考虑到null代表空对象的概念而不是空的概念,所以他又设计一种undefined类型来代表空的概念,但后来证明纯粹是他多想了,所以null类型单列出来成为独立的类型,undefined应该被剔除,但是为了兼容性问题这都是不可改变的.
• 它们唯一的区别就是在转换为数值类型时前者转换为0,而后者转换为NaN
• 关于二者的建议:我认为现在undefined的地位应该由null取代而我们也不要去使用undefined

类型值

类型值	说明
null/undefined	/

布尔值

类型值

类型值	说明
true/false

字符串

字符串是由双引号或单引号引起的字符集合,它是不可改变的,但是可以使用方括号运算符访问字符串中的字符
模板字符串
模板字符串由反引号标识,可以在字符串中使用${}嵌入变量,如果大括号内不是字符串那么先转化为字符串,如果是对象那么调用对象的toString方法

Symbol

Symbol表示独一无二的值,它由Symbol函数生成,该函数可以接受一个字符串作为Symbol值的描述,Symbol值不能与其他类型值运算,它只能转换为字符串和布尔值

内置Symbol值

Symbol.hasInstance

• 对象的该属性指向一个方法,当其他对象使用instanceof运算符判断是否是该对象的实例时会调用这个方法

Symbol.isConcatSpreadable

• 该属性表示一个布尔值,表示对象用于数组的concat方法时是否可以展开,默认为undefined,当值为undefined和true时表示可以展开

Symbol.species

• 该属性指向一个构造函数,创建衍生对象时会使用该属性,所以该属性要使用get取值器

Symbol.match

• 该属性指向一个函数,当调用match()函数时会使用该属性

Symbol.replace

• 该属性指向一个方法,当该对象被String.prototype.replace方法调用时会返回该方法的返回值

Symbol.search

• 该属性指向一个方法,当该对象被String.prototype.search方法调用时会返回该方法的返回值

Symbol.split

• 该属性指向一个方法,当该对象被String.prototype.split方法调用时会返回该方法的返回值

Symbol.iterator

• 该属性指向对象的默认便利器方法,进行for…of循环时会调用此方法

Symbol.toPrimitive

• 该属性指向一个方法,当该对象被转化为原始类型时会调用此方法
• 该属性被调用时可以接受一个字符串参数,表示当前运算的模式:Number,String,Default

Symbol.toStringTag

• 该属性指向一个方法,用于定制调用toString方法返回字符串后面的内容

对象(object)

对象是指由各种数据类型组成的复杂类型,就是由一组组键值对组成的
它可以分为多个子类型:

• 原始对象
  仅有一个:Object的原型,即Object,prototype
• 原始函数
  仅有一个:Function的原型,即Function.prototype
• Object
• Function
• Array
• Number
• String
• Boolean
• Error
• console
• Math
• Date
• RegExp
• …

属性

• 对象中所有属性名名都是字符串,所以可以不加引号
• 如果属性名不符合标识符条件则必须加上引号
• 属性所对应的属性值可以是任意类型
• 可以使用点运算符读取属性
• 也可使用方括号运算符读取属性,方括号内可以使用表达式,如果要使用属性名那么必须加上双引号

属性特性

属性特性是js内部数据结构,用于描述对象的属性

{
     
	value:undefined,
	writable:true,
	enumerable:true,
	configurable:true,
	get:undefined,
	set:undefined
}

特性	默认值	说明
value	undefined	该属性的属性值
writable	true	属性是否可写
enumerable	true	属性是否可遍历
configurable	true	属性是否可以配置,如果设为false那么该属性将不会被删除,也不能修改除value特性之外的特性
get	undefined	是一个函数,定义获取该属性时的行为
set	undefined	是一个函数,定义修改该属性时的行为

super

super关键字指向当前对象的原型对象,但只能用在对象的属性方法中

类型判断

typeof

类型	返回值
数值	number
字符串	string
布尔值	boolean
函数	function
undefined	undefined
对象	object
null	object

注意:

• 如果一个变量没有声明我们就使用它编译器会直接报错,而typeof可以用来检查一个变量是否声明,未声明的变量typeof会返回undefined
• null类型typeof返回object是由于历史造成的,1995年js设计的时候只有五种类型而把null作为object一种特殊值,后来null独立出来了,但为了兼容以前的代码返回值就无法改变了
• 如果你要问typeof函数返回值为function而不是object那么为什么函数不独立出来作为独立类型的话我也无法回答

instanceof

该对象返回一个布尔值,表示对象是否为某个构造函数的实例,他会检查右侧构造函数是否存在于左侧对象的原型链上

Object.prototype.toString

类型转换

在js中各种运算符对操作的类型都有要求,如果不符合预期那么就会自动进行类型转换,当然我们也可以强制转换类型

强制转换

函数	对象	数值	字符串	布尔值	undefined	null
Number()	首先调用对象的valueOf函数,如果返回的是原始类型则调用Number函数否则再调用对象的toString方法,如果返回值是原始类型则调用Number函数,否则报错	原始值	自动滤去开头结尾空格,当传入字符串中含任意字符时返回NaN	true转为1,false转为0	NaN	0
String()	首先调用对象的toString方法如果返回值为原始类型则调用String否则再调用对象的valueOf方法如果返回值为基本类型则调用String方法,否则报错	相应字符串	原始值	true转为"true",false转为"false"	转为"undefined"	转为"null"
Boolean()	任何对象都转换为true	仅0为false	仅空字符串为false	原始值	false	false

自动转换

自动转换为布尔值
js预期某位置应该是布尔值,会自动将该位置现有的值转化为布尔值,除了下面几个值转化为false之外其他都转化为true

• null/undefined
• 0
• NaN
• 空字符串

自动转换为字符串
字符串的自动转换主要发生在字符串的加法运算时,当一个操作数是字符串时,另一个为非字符串,则后者转换为字符串,当存在对象时则先将对象转换为基本类型

自动转换为数值
js在遇见预期为数值的地方会自动调用Number()函数,除了加法运算可能将操作数转换为字符串为其他运算符都会自动将操作数转换为数值

运算符

特殊运算规则

除法运算规则

• js中的除法运算和真实的数学计算一样有整有余

加法运算规则

• 除加法外的所有算术运算符都会将操作数转化为数值类型再进行运算,加法的不同在于当一个操作数是字符串时加号会重载为连接符
• 如果操作数有一个为对象那么先要将对象转换为基本类型再参与计算,对象转换为基本类型的规则为先调用对象的valueOf方法默认返回对象自身,再调用对象的toString方法,如果valueOf的返回值本身就是一个基本类型那么就不会再调用toString方法,如果操作数为一个Date对象那么会直接调用toString方法

比较运算规则

• 除严格相等严格不相等外的比较运算符的在使用时首先将所有操作数转换为数值类型
• NaN参与的比较运算结果都为false
• 操作数包含对象时,对象会先转换为原始类型再参与计算

void运算符

void运算符的作用是执行一个表达式,然后不返回任何值,或者说返回undefined

…扩展运算符

扩展运算符可以将实现了Iterator接口的对象转换为参数列表

语句

错误处理

内置错误对象

当js代码发生错误时会抛出一个错误对象,这个错误对象都是Error的实例

属性	说明
message	错误提示信息
name	错误名称(非标准属性)
stack	错误的堆栈(非标准属性)

在Error的基础上,js还定义了其他六种Error的派生错误对象

对象	说明
SyntaxError	解析代码时发生的语法错误
ReferenceError	引用一个不存在变量时或将一个值分配给无法分配的对象时发生的错误
RangeError	值超出有效范围时发生的错误,比如数组长度为负数,Number对象的方法参数超出范围,函数堆栈超出最大值
TypeError	对象是变量或参数不是预期类型或调用对象不存在的方法时发生的错误
URIError	URI相关函数参数不正确时抛出的错误
EvalError	eval函数没有正确执行时抛出的错误,已停止使用

自定义错误

自定义错误只需继承Error对象就可以

错误抛出

使用throw语句可以将错误抛出,js引擎在遇见throw语句时程序就终止了

错误捕获

使用try...catch...finally语句结构来捕获异常

代码调试

console对象是js的原生对象,它的浏览器实现包含在浏览器自带的开发工具中

• Elements:查看网页的HTML源码和CSS代码
• Resources:查看网页加载的各种资源文件以及在硬盘创建的各种内容
• Network:查看网页的HTTP通信情况
• Sources:查看网页加载的脚本源码
• TimeLine:查看网页行为随时间变化的行为
• Performance:查看网页的性能情况
• Console:用来运行js命令

console对象的方法

console存在大量的方法,这里只介绍比较特殊的

方法	参数	说明
log()	一个或多个	将参数连起来输出到控制台,会自动添加换行符,第一个参数还可以使用格式化占位符字符串,%s:字符串,%d:整数,%i:整数,%f:浮点数,%o:对象的链接,%c:CSS格式字符串
debug()	同上	与log方法相似,但是只有在勾选verbose选项时才会显示信息
warn()	同上	与log相似,不同之处在于输出信息时会加一个黄色三角号
error()	同上	与log相似,不同之处在于输出信息时会加一个❌
table()	一个	对于符合类型,此方法可以转换为表格显示
count()	/	放在函数内用于输出当前函数被调用多少次
dirxml()	一个	与dir相似,但可以以目录树的形式打印DOM节点
assert()	第一个参数为表达式,第二个参数为字符串	用于程序运行时的断言,只有第一个参数结果为false,才会打印第二个参数
time()/timeEnd()	一个描述字符串	打印在这两个函数中间的操作花了多少时间
trace()	/	打印当前代码在堆栈执行的轨迹
clear()	/	清空控制台

控制台命令行API

命令	说明
$_	返回上一个表达式的值
$0~$4	控制台保存最近五个在Elements面包选中的DOM元素,$0代表最近的一个
$(selector)	类似document.querySelector()
$$(selector)	类似docuument.querySelectorAll()
$x(path)	返回一个数组,包含匹配path的所有DOM元素
getEventListeners(object)	但会一个对象,该对象成员为object登记了回调函数的各种事件,每个事件对应一个数组,数组的成员为该事件的回调函数
keys(object)	返回object所有键名
values(object)	返回object所有键值
monitorEvents(object,[events])/unmonitorEvents(object,[events])	前者用于监听某对象的特定事件,事件发生时会返回一个Event对象,该对象包含事件的相关信息,后者用于停止监听,可以监听的事件有mouse:mousedown,mouseup,click,dblclick,mousemove,mouseover,mouseout,mousewheel key:keydown,keyup,keypress,textinput touch:touchstart,touchmove,touchend,touchcancel control:resize,scroll,zoom,focus,blur,select,change,submit,reset
claer()	清除控制台记录
copy(object)	复制特定DOM元素到控制台
dir(object)	console.dir方法的别名
dirxml(object)	console.dirxml方法的别名

debugger语句

该语句用于设置断点,如果有正在运行的排错语句,遇见该语句就会停下

API

Object对象

静态属性

属性名	参数	返回值	说明
keys()	一个对象	数组	对象自身所有可枚举的属性名
seal()	目标对象	/	使目标对象无法添加删除属性,实质是把可配置特性设置为false
isSealed()	目标对象	布尔值	判断一个对象是否使用了seal方法
freeze()	目标对象	/	使目标对象无法增加删除修改属性
isfrozen()	目标对象	布尔值	判断一个对象是否可以被冻结
create()	第一个参数为模板对象,第二个参数为一个对象,属性为操作对象的属性,属性值为属性的特性对象	新对象	指定原型对象,返回一个新的对象
is()	/	/	它与===基本一致,不同之处在于正零不等于负零,NaN等于自身
entries()/keys()/values()	/	/	返回一个遍历器对象
fromEntries()	/	/	entries方法的逆操作

原型属性

属性名	参数	返回值	说明
valueof()	/	/	返回当前对象对应的值,默认返回对象自身
toString()	/	/	返回当前对象对应的字符串形式,默认返回对象字符串
toLocaleString()	/	/	返回当前对象对应的本地字符串形式,默认返回对象字符串
hasOwnProperty()	属性名字符串	布尔值	判断某个属性是否为当前对象自身属性性
isPrototyypeOf()	对象	布尔值	判断当前对象是否为一个对象的原型
propertyIsEnumervble()	属性名字符串	布尔值	判断对象某个自身属性是否可以枚举

Function对象

浏览器中在块级作用域声明函数时函数会进行变量提升,尽量避免在块级作用域声明函数或直接使用函数表达式

原型属性

属性名	参数	返回值	说明
name	/	/	返回函数的名字
length	/	/	见下文
toString()	/	/	返回包含函数源码的字符串,原生函数返回function(){native code}
call()	第一个参数为this所指的对象,其他参数为函数参数	/	指定函数内部this的指向,如果参数为空,null或undefined则默认传入全局对象,如果传入的是基本类型,那么会先将基本类型转换为对应的包装类
bind()	同call	新函数	此方法用于将函数体内的this绑定到某个都西昂,然后返回一个函数

参数

函数的参数是可以省略的,你写不写并不影响使用时传不传

length

函数的length属性只取决于书写的无默认值的形参的个数,也不包括rest参数个数

默认值

函数参数可以有默认值,如果含有默认值的参数不在形参列表的最后一个那么在传入参数的时候将不能忽略,一旦设置了默认值那么函数参数自成作用域,等到初始化解说后这个作用域就会消失

rest参数

function fun(...args) {
     }

使用rest参数可以避免使用arguments对象,rest变量是一个真正的数组,rest参数后面不能再有其他参数

闭包

闭包是指在某个函数外部可以读取到该函数内部作用域的内容,实现的方法就是在该函数内返回一个函数,返回的函数就叫做闭包,闭包能够返回外层函数的内部变量的原因是闭包用到了外部函数中的变量导致外部函数不能从内存中释放,只要闭包没有被垃圾回收机制释放那么外层函数提供的运行函数就不会被清除.

立即调用函数表达式

立即调用函数表达式已经不再需要,完全可以由块级作用域替代

(function(){
     })()

箭头函数

let fun=()=>{
     }

• 在箭头函数内this指向定义时所在的对象,而不是使用时所在的对象,因为箭头函数里面根本没有自己的this,而是引用外层作用域的this,因此箭头函数不能当作构造函数使用
• 箭头函数内部的super,new.target变量也是指向外层的
• 箭头函数不可以使用yield命令

构造函数

构造函数是专门用来生成对象实例的函数,它有两个特点

• 函数内使用this关键字,代表所要生成的对象实例
• 生成对象的时候次序使用new关键字

new命令

new命令的作用就是执行执行构造函数,返回一个实例对象,如果构造函数内部有return语句并且返回一个对象,那么new命令会返回此对象,否则就会返回this对象,如果对一个没有this的普通函数使用new命令则返回一个空对象

原理

• 创建一个空对象,作为将要返回的对象实例
• 将这个空对象的原型,指向构造函数的prototype属性
• 将这个空对象赋值给函数内部的this关键字
• 开始执行构造函数内部的代码

new.target

函数内部可以使用new.target命令,如果当前函数是new命令调用,那么此命指向当前函数,否则为undefined

this关键字

this指向所在函数所处的对象(运行环境)

实质

js对象存储在内存中将地址值赋给变量,而js对象的属性在内存中以特性对象的方式存储,属性值是保存在特性对象的value属性当中的,当一个对象的属性值为一个函数时,js会将函数单独保存在内存中并将函数的地址赋给value属性,由于函数可以在不同的运行环境执行,所以需要一种机制能够在函数内部获取当前运行的环境,所以this就出现了,它出现的目的就是在函数内部指代当前的运行环境,如何判断函数的执行环境只需要看在函数执行时先获取的地址是谁,如果只有函数自身的地址,那么this就指向window(全局运行环境),

原型

prototype

js中每个函数都有一个prototype属性指向一个对象,对于普通函数来说几乎没用,但是对于构造函数来说,该属性会自动成为实例对象的原型,它的作用就是共享属性

原型链

每一个对象都有一个__proto__属性指向它的原型对象,原型对象也有它的原型,这就形成了一条原型链,所有对象的原型都可以追溯到Object.prototype对象,该对象的原型为null,所以原型链的尽头是null,当实例对象自身没有某个属性时就会到它的原型链中寻找,直到找到最顶层的Object.prototype对象,如果实例对象和原型对象有同名的属性那么会优先读取实例对象自身的属性

constructor属性

每个原型对象都有一个constructor属性指向原型对象所在的构造函数,该属性的作用是可以知道某个实例对象到底是哪个构造函数产生的

构造函数的继承

第一步
在子类构造函数调用父类构造函数

    function son(params) {
     
      father.call(this)
    }

第二步
让子类的原型包含父类的原型

    son.prototype=Object.create(father.prototype)
    son.prototype.constructor=son

Array

• 数组中的每一项可以是任何类型
• 数组本质是一个对象,它的属性名是一组整数(1,2,3…),但是数组只能使用中括号运算符读取属性

类数组对象

类数组对象的特征是具有length属性,但是该属性不会动态变化,比如说arguments对象和字符串对象,可以使用Array.from()方法将类数组对象转换为真正的数组

静态属性

属性名	参数	返回值	说明
isArray()	目标对象	布尔值	判断目标对象是否为数组
from()	类数组对象或可遍历对象	数组	将类数组对象和可遍历对象转换为真正的数组
of()	/	/	将一组值转换为数组

原型属性

属性名	参数	返回值	说明
length	/	/
valueof()	/	/	返回数组本身
toString()	/	/	返回数组的字符串形式
push()	数组元素	数组长度	在数组末端添加新元素
pop()	/	被删除元素	删除数组最后一个元素
shift()	/	被删除元素	删除数组第一个元素
unshift()	接收多个数组元素参数	数组长度	将所有元素添加到数组头部
fill()	第一个参数为参数值,第二个参数为起始位置,第三个参数为结束位置	数组	将参数值填充到指定位置
join()	分隔符默认为逗号	拼接后的字符串	以特定分隔符将数组成员连接成一个字符串
concat()	多个参数	新数组	将参数连接到远数组后部,返回新数组,原数组不变
reverse()	/	新数组	用于颠倒数组元素顺序
slice()	开始位置,终止位置	新数组	提取数组的一部分,返回新数组原数组不变
splice()	第一个参数为删除的起始位置,第二个参数为删除元素的个数默认为全部,后面的参数为加入数组的新参数	返回被删除的数组	/
sort()	函数(可选)	排序后的数组	无参将数组转化为字符串再进行排序,有参时根据参数函数的返回值的正负排序
map()	第一个参数为函数,第二个参数用来绑定回调函数内部的this变量(可选)	数组	map方法将数组的所有成员依次传入参数函数并将函数返回值组成一个新数组返回,参数函数可以接受三个参数:当前成员,当前位置和原数组map方法会跳过数组的空位
forEach()	同上	/	该方法与map方法类似但是不返回值
filter()	同上	数组	该方法与map方法类似但是返回的是使参数函数返回true的成员组成的一个新数组
find()	同上	数组成员	返回参数函数返回true的数组成员,没有返回undefined
findIndex()	同上	下标	返回参数函数返回true的数组成员的下标,没有返回-1
some()	同上但没有第二个参数	布尔值	函数参数返回一个布尔值,只要一个成员的返回值为true则整个some方法的返回值就是true
every()	同上	布尔值	同上但只有所有参数返回值为true此方法返回值才为true
reduce()/reduceRight()	函数	处理结果	此方法依次处理数组的每成员,最后累计成一个值将该值返回,参数函数接收四个参数:累积变量:默认为数组的第一个成员,当前变量:默认为数组第二个成员,当前位置(可选):从0开始,原数组(可选)
indexOf()/lastIndexOf()	第一个参数为要搜寻的数组元素,第二个参数为搜索的开始位置(可选)	存在返回元素位置不存在返回-1	用于搜索元素在数组第一次出现的位置,对NaN无效,没有返回-1
copyWithin()	第一个参数为开始替换数据的位置,第二个参数为开始读取数据的位置可选默认为零,第三个参数为结束数据读取的位置,可选默认为数组长度	修改后的数组	在原数组内部替换成员
entries()/keys()/values()	/	/	返回一个遍历器对象
includes()	/	/	判断数组是否存在某值
flat()	整数	/	将数组摊平,如果要摊平多层就传入大的数字

Set/Map

• Set成员的值都是唯一的,没有重复的
• Set成员可以是任意类型

原型属性

属性	参数	返回值	说明
size	/	/	Set成员个数
add()	成员	Set	添加成员,返回Set自身
delete()	成员	布尔值	删除成员
has()	成员	布尔值	判断某值是否为Set成员
clear()	/	/	清除所有成员
entries()/keys()/values()	/	/	返回一个遍历器对象
forEach()	/	/	同数组

包装类

某些场合原始类型值会自动转变为包装类对象,并在使用后立即销毁包装类对象在,自动生成的包装类对象是只读的,无法修改.

String

静态属性

属性名	参数	返回值	说明

原型属性

属性名	参数	返回值	说明
length	/	返回字符串的长度	/
valueOf()	/	返回原始类型的值	/
toString()	/	返回对应的字符串形式	/
charAt()	位置	字符	返回指定位置的字符
concat()	多个参数	新字符串	用于连接两个字符串,返回一个新的字符串,如果参数不是字符串则先将参数转换为字符串
slice()	起始位置,结束位置	新字符串	在原字符串截取一个新字符串
indexOf/lastIndexOf()	第一个参数为字符串,第二个参数为查询的起始位置	位置数字	查询字符串第一次出现的的位置
trim()/trimStart()/trimEnd()	/	/	去除两边的空格
toLowerCase()/toUpperCase()	/	/	转换大小写
search()	字符串	字符串第一次出现的位置,未找到返回-1	匹配字符串
replace()/replaceAll()	第一个参数为被替换字符串,第二个参数为替换字符串	返回替换后的字符串	替换匹配到的第一个字符串
split()	第一个参数为规则字符串,第二个参数为返回数组的最大长度(可选)	数组	按照制定规则分割字符串,返回一个由子字符串组成的数组
includes()/startWith()/endWith()	第一个参数为查询字符串,第二个参数为起始搜索位置(可选)	布尔值	查询字符串
repeat()	整数	新字符串	将原字符串重复n次
padStart()/padEnd()	第一个参数为补全后字符串的长度,第二个参数为用来补全的字符串	新字符串(可省略默认使用空格)	补全字符串

Number

静态属性

属性	参数	返回值	说明
POSITIVE_INFINITY	/	/	正无限大
NECATIVE_INFINITY	/	/	负无限大
NaN	/	/	非数值
MIN_VALUE	/	/	最小正数
MAX_SAFE_INTEGER	/	/	最大整数
MIN_SAFE_INTEGER	/	/	最小整数
parseInt	字符串 数值(默认为10)	数值	此方法会根据第二个参数将第一个字符串转换为相应进制的整数 如果字符串开头有空格会被自动去除 如果第一个参数不是字符串该方法会将其转换为字符串再进行数值的转化 转换为字符串时是一个一个字符转换的,如果遇见一个不能转换为数字的字符就会返回转换好的部分 如果字符串除正负号的第一个字符不能转换为数字那么就返回NaN
parseFloat	字符串	数值	此方法将第一个字符串参数转化为浮点数 如果字符串开头有空格会被自动去除 如果第一个参数不是字符串该方法会将其转换为字符串再进行数值的转化 转换为字符串时是一个一个字符转换的,如果遇见一个不能转换为数字的字符就会返回转换好的部分 如果字符串除正负号的第一个字符不能转换为数字那么就返回NaN
isNaN	数值	布尔值	只对NaN返回true
isFinite	数值	布尔值	非数值一律返回false

原型属性

属性名	参数	返回值	说明
length	/	返回字符串的长度	/
valueOf()	/	返回原始类型的值	/
toString()	表示输出进制的数字默认为10	返回对应的字符串形式	/
toFixed()	指定位数的数字	小数	将一个数转换为指定位数的小数
toExponetial()	小数点后有效数字的位数	科学计数法数字	将一数字转换为科学计数法表示的数字
toPrecision()	有效数字的位数	有效数字	将一数字转换为指定位数的有效数字

Math

静态属性

属性	参数	返回值	说明
abs()			绝对值
ceil()			向上取整
floor()			向下取整
max()			最大值
min()			最小值
pow()			幂运算
sqrt()			平方根
cbrt()			立方根
round()			四舍五入
random()			0,1之间的随机数
trunc()			去除数的小数部分

Date

Date实例有个特殊的地方,其他对象在求值的时候默认调用的是valueOf函数,而Date实例默认调用的是toString函数,直接返回代表时间的字符串,所以两个Date在进行加法运算时会得到一个字符串

构造函数参数

• 参数可以是负数,代表1970年元旦之前的时间
• 只要能被Date.parse()方法解析的字符串都可以作为参数
• 参数为年,月,日多个参数时年和月是不能省略的,其他参数可以省略,否则参数被当作到时间零点的毫秒数进行解析
• 各个参数只有日是从一开始算起的,其他参数都是从零开始算起的

静态属性

属性	参数	返回值	说明
now()	/	返回当前距时间零点的毫秒值	/
parse()	日期字符串	成功返回日期字符串到时间零点的毫秒数,失败返回NaN	解析时间字符串,时间字符串应符合YYYY-MM-DDTHH:mm:ss:sssZ格式,其中Z表示时区,

原型属性

属性	参数	返回值	说明
valueOf()	/	/	返回实例对象距离时间零点的毫秒数
toString()	/	/	返回时间字符串
toJSON()	/	/	返回一个符合HSON格式的ISO日期字符串
toDateString()	/	/	返回日期字符串
toTimeString()	/	/	返回时间字符串
toLocaleString()	/	/	完整本地时间
toLocalDateString()	/	/	本地日期
toLocalTimeString()	/	/	本地时间
get/setTime()	/	/	同valueOf方法
get/setDate()	/	/	返回月号
getDay()	/	/	返回星期几,周日为0
get/setFullYear()	/	/	返回四位年份
get/setMonth()	/	/	返回月份,0代表一月
get/setHours()	/	/	返回小时
get/setMilliseconds()	/	/	返回毫秒
get/setMinutes()	/	/	返回分钟
get/setSeconds()	/	/	返回秒

RegExp

此对象的使用方法有两种,第二种方式可传入一个可选参数修饰符

let regexp=/正则表达式/

let regexp=new RegExp("正则表达式","修饰符")

实例属性

属性	参数	返回值	说明
ignoreCase	/	布尔值	是否设置了i修饰符
global	/	布尔值	是否设置了g修饰符
multiline	/	布尔值	是否设置了m修饰符
flags	/	字符串	返回已经设置的所有修饰符
lastIndex	/	整数	返回下一次搜索的位置
source	/	字符串	返回正则表达式字符串形式
test()	字符串	布尔值	测试当前模式是否能匹配字符串
exec()	字符串	数组	如果有匹配的结果就返回一个数组,成员为匹配成功的子字符串,否则返回null

JSON

JSON是一种轻量级的基于文本的可读的格式

语法

• 数组使用[]表示
• 对象使用{}表示
• 属性名全部要放到双引号内
• 属性值只能是字符串(双引号引起),十进制数值(不包括NaN,正负无穷大),布尔值,null,对象和数组

在js中可以使用JSON对象实现js对象与JSON文本之间的转换

JSON.stringify()

• 参数一:将要转化为JSON文本的值
• 参数二(可选):如果该参数是一个函数，则在转化过程中，被转化的值的每个属性都会经过该函数的转换和处理；如果该参数是一个数组，则只有包含在这个数组中的属性名才会被转化到最终的 JSON 文本中；如果该参数为 null 或者未提供，则对象所有的属性都会被转化。
• 参数三(可选):指定缩进用的空白字符串，用于美化输出（pretty-print）；如果参数是个数字，它代表有多少的空格；上限为10。该值若小于1，则意味着没有空格；如果该参数为字符串（当字符串长度超过10个字母，取其前10个字母），该字符串将被作为空格；如果该参数没有提供（或者为 null），将没有空格
• 返回值:string

JSON.parse()

• 参数一:将要转换为js值的JSON文本
• 参数二(可选):如果传入该参数函数，可以用来修改解析生成的原始值，调用时机在 parse 函数返回之前
• 返回值:object

静态属性

属性	参数	返回值	说明
stringify()	第一个参数为目标值,第二个参数为数组或函数(可选),第三个参数可以增加可读性	字符串	将一个值转换为JSON字符串,不符合要求的值会被过滤,此方法也会忽略对象的不可枚举属性,第二个参数可以指定对象的哪些属性需要转换为字符串,函类似数组的map方法,
parse()	第一个参数为一个有效的JSON字符串	JSON	将JSON字符串转换为JSON对象,还可接受一个函数参数,与stringify方法参数类似

Proxy

new Proxy(target,handler)

Proxy为目标对象架设了一层拦截,target为目标对象,handler为一个对象用于定制拦截动作

静态属性

属性	参数	返回值	说明
revocable()	目标对象,操作对象	返回对象的proxy属性是Proxy实例,revoke属性是一个函数可以取消Proxy实例	返回一个可取消的Proxy实例

原型属性

属性	参数	返回值	说明
get()	第一个参数为目标对象,第二个参数为属性名,第三个参数为Proxy实例本身(可选)	/	用于拦截某个属性的获取操作
set()	第三个参数多了一个属性值参数,其他同上	/	拦截某个属性的赋值操作
apply()	第一个参数为目标对象,第二个参数为目标对象的上下文对象,第三个对象为目标对象的参数数组	/	用域拦截函数的调用,call和apply操作
has()	第一个参数为目标对象,第二个参数为需要查询的属性名	/	用于拦截判断对象是否具有某个属性的操作,但是无法判断属性是否是对象继承的
construct()	第一个参数为目标对象,第二个参数为构造函数数组,第三个参数为new命令作用的构造函数	对象	用于拦截new命令
deleteProperty()	第一个参数为目标对象,第二个参数为要删除的属性	布尔值	用于拦截delete操作,此方法抛出异常返回false时当前属性无法被删除
defineProperty()	第一个参数为目标对象,第二个参数为要添加的属性	布尔值	用于拦截添加属性操作
getOwnPropertyDescriptor()	第一个参数为目标对象,第二个参数为要获取的属性	undefined或特性对象	用于拦截defineProperty()
getPrototypeOf()	目标对象	null或对象	拦截获取原型操作
isExtensible()	目标对象	布尔值	用于拦截isExtensible操作,它的返回值必须和isExtensible属性保持一致,否则报错
ownKeys()	目标对象	/	用于拦截对象自身属性的读取
preventExtensions()	/	/	用于拦截preventExtensions
setPrototypeOf()	/	/	用于拦截setPrototypeOf

Reflect

• 将Object对象的一些明显属于语言内部的方法放到Reflect上
• 修改一些Object方法的返回结果
• 让Object操作变成函数行为
• Reflect对象的方法和Proxy对象的方法一样

静态属性

属性	参数	返回值	说明
get(target,name,receiver)	第一个参数为目标对象,第二个参数为属性名	/	查找target对象的name属性,没有返回undefined
set(target,name,value,receiver)	第三个参数多了一个属性值参数,其他同上	/	设置某个属性的值
apply()	第一个参数为目标对象,第二个参数为目标对象的上下文对象,第三个对象为目标对象的参数数组	/	用域拦截函数的调用,call和apply操作
has(obj,name)	第一个参数为目标对象,第二个参数为需要查询的属性名	/	查询属性
construct()	第一个参数为目标对象,第二个参数为构造函数数组,第三个参数为new命令作用的构造函数	对象	用于拦截new命令
deleteProperty()	第一个参数为目标对象,第二个参数为要删除的属性	布尔值	用于拦截delete操作,此方法抛出异常返回false时当前属性无法被删除
defineProperty()	第一个参数为目标对象,第二个参数为要添加的属性	布尔值	用于拦截添加属性操作
getOwnPropertyDescriptor()	第一个参数为目标对象,第二个参数为要获取的属性	undefined或特性对象	用于拦截defineProperty()
getPrototypeOf()	目标对象	null或对象	拦截获取原型操作
isExtensible()	目标对象	布尔值	用于拦截isExtensible操作,它的返回值必须和isExtensible属性保持一致,否则报错
ownKeys()	目标对象	/	用于拦截对象自身属性的读取
preventExtensions()	/	/	用于拦截preventExtensions
setPrototypeOf()	/	/	用于拦截setPrototypeOf

并发

js在设计时就被设计为单线程,这是这门语言的核心,但是H5允许js创建多个线程,但是子线程必须完全受主线程控制,并且不能操作DOM,js在运行时除了一个正在运行的主线程,js引擎还提供一些任务队列,里面是需要运行的异步任务,首先,主线程会执行所有的同步任务,等到同步任务执行完毕就回去检查任务队列中的异步任务,如果满足条件异步任务就会进入主线程变为同步任务并开始执行,待所有任务队列清空后程序结束运行.

定时器

定时器提供定时执行代码的功能,但是如果一轮事件没有循环完即使到达定时时间,定时事件也不会发生,所以当定时时间为0时定时事件也不会立即执行,而是放在浏览器最早可得到空闲时间执行

方法	参数	返回值	说明
setTimeout()	第一个参数为一个函数或者一段代码字符串,第二个参数为延迟的毫秒数,其他参数为参数函数的参数	返回定时器的整数编号	多个定时器返回的数值是连续的
setInterval()	同上	同上	它与setTimeout的区别是它每隔一段时间连续执行
clearTimeout()	计时器编号	/	取消定时器
clearInterval()	计时器编号	/	取消定时器

Promise

promise对象代表着一个异步操作,有三种状态:进行中(pending),已完成(resolved),已失败(rejected),只有异步操作的结果才能决定当前是哪一种状态,一旦状态发生改变,这时promise就定型了,不会再发生改变

    new Promise((resolve,reject)=>{
     
        if (/*异步操作成功*/){
     
            resolve()
        }else {
     
            reject()
        }
    })

resolve
该函数的作用是将promise的状态从未完成转变为成功,并将异步操作结果作为参数传递出去
reject
该函数的作用是将promise的状态从未完成转变为失败,并将异步操作结果作为参数传递出去,此方法传出的数据具有冒泡性质,会一直向后传递,直到被回调函数接收为止
抛出异常
在Promise中直接抛出异常与reject函数作用一样,reject函数的回调函数同样可以接收异常

原型属性

then()

• 参数一(可选):resolve函数的回调函数
• 参数二(可选):reject函数的回调函数
• 返回值:新Promise对象

此方法的作用是为Promise对象添加状态改变时的回调函数,回调函数可以接收转台函数传出的数据

catch()

• 参数一:reject函数的回调函数
• 返回值:新Promise对象

此方法用于指定reject函数的回调函数或捕获Promise中的错误,在此方法内还可以抛出异常

finally()

• 参数一:回调函数

此方法用于指定一个回调函数最后执行,该回调函数不接收参数

静态属性

all()

• 参数一:具有Iterator接口的对象
• 返回值:新Promise对象

此方法将多个Promise实例包装成一个新的Promise实例,如果参数中有一个状态为已失败,那么新实例的状态就为已失败,第一个状态为已失败的实例的参数会传给新实例的回调函数,但是如果状态为已失败的实例自己有回调函数那么就不会触发新实例的回调函数,如果所有参数的状态均为已成功,那么新实例的状态才为已成功,此时参数的返回值会组成一个数组传给新实例的回调函数,无论状态为已成功的实例有没有自己的回调函数都会触发新实例的回调函数,但是有回调函数的参数会变为undefined

race()

• 参数一:具有Iterator接口的对象
• 返回值:新Promise对象

只要参数中有一个实例状态发生改变那么新实例的状态就会跟着改变,率先改变的实例的返回值传给新实例的回调函数
any()

• 参数一:具有Iterator接口的对象
• 返回值:新Promise对象

只要有一个参数变为已成功状态,新实例的状态就会变为已成功,只有所有参数变为已失败状态新实例才会变为已失败状态

allSettled()

• 参数一:具有Iterator接口的对象
• 返回值:新Promise对象

只有所有参数状态发生改变,新实例的状态才能确认,新实例的状态永远是已失败,新实例的回调函数得到的参数是一个由每个参数成员一一对应的Promise实例的数组

resolve()

• 参数一:object
• 返回值:Promise对象

此方法将参数转变为Promise对象

reject()

• 参数一:object
• 返回值:Promise对象

此方法会返回一个状态为已失败的Promise实例,参数作为回调函数接收的参数

Generator函数

Generator函数是一个状态机,内部封装了多个状态,执行Generator函数会返回一个迭代器对象,可以依次遍历Generator函数内部的每一个状态,Generator函数有了两个特征一是function关键字和函数名之间有一个星号,二是函数内部使用yield表达式定义不同的内部状态,调用Generator函数后,该函数并不执行,返回的也不是函数的运行结果,而是一个指向内部状态的迭代器对象,我们调用迭代器的next方法使指针移向下一个状态,一但Generator函数执行过程中抛出错误且没有被内部捕获,如果还需调用next方法将返回一个value等于undefined,done等于true的对象

    function *gFun(){
     
        yield "hello";
        yield  "world";
        return "ending"
    }
    let b=gFun()
    while(true){
     
        let a=b.next()
        if (a.done){
     
            break
        }
        console.log(a.value)
    }

yield

yield就是函数暂停运行的标志,yield后面的表达式的值是惰性求值,只有调用nex方法才会进行求值,yield只能用在Generator函数内,yield出现在另一个表达式时必须放在括号内,迭代器next方法的运行逻辑如下:

• 遇见yield就停止运行,并将紧跟在yield后面的那个表达式的值作为返回对象的value属性值
• 下次调用next方法时继续向下运行,直到遇见下一个yield
• 如果没有遇见新的yield就一直运行知道函数结束,当遇见return语句时就将return语句后面的表达式的值作为返回对象的的value属性值

yeild*

yield*用于在Generator函数内调用另一个Generator函数,等同一个for…of循环,实际上直言有迭代器的数据类型就可以使用该表达式代理,如果被代理的Generator函数内有return语句那么返回值会返回给当前函数

返回值

Generator函数返回一个迭代器对象,该迭代器是Generator函数的实例,该对象有以下三个函数
next()

• next方法相当于将yeild替换为一个值
• yield本身没有返回值,如果next’方法传入一个参数那么这个参数将作为上一个yield的返回值

return()

• return方法相当于将yeild替换为一个return语句
• Generator函数返回的遍历器对象都有一个return方法,该方法可以接受一个参数,如果调用该方法那么Generator函数就停止遍历了,返回值的value属性就是该函数的参数,done就是true,如果Generator函数内部有finally语句那么该方法会导致立即进入funally

throw()

• throw语句相当于将yeild替换为throw语句
• Generator函数返回的遍历器对象都有一个throw方法,可以在函数外部抛出错误,然后在Generator函数体内捕获,该方法可以接受一个参数,该参数可以被catch语句接收,throw方法被捕获后会附带执行下一次yeild表达式

async

async函数是Generator函数的语法糖,从表面上看就是将Generator函数的星号换成async,将yield替换成await.

await

正常情况下,await命令后面是一个Promise对象,返回该对象的结果,如果不是Promise对象就直接返回对应的值,await命令后面的Promise对象如果变成已失败状态,则reject的参数会被catch方法的回调函数接收到,任何一个await语句后面的Promise对象变为reject状态,那么整个async函数都会中断执行,如果我们不希望async函数中断那么可以将可能失败的Promise实例放到try…catch结构里面

返回值

async函数返回一个Promise对象,当函数执行的时候,一旦遇见await就会先返回,等到异步操作完成,再接着执行函数体内后面的语句,async函数内部的return语句返回的值会成为then方法回调函数的参数,async函数内部抛出的错误会使返回的Promise实例变为已失败状态,抛出的错误对象会被catch方法回调函数接收到,如果没有return和抛出异常,那么只有将所有代码执行完返回的Promise实例才会变化状态,如果await后面的Promise实例有一个变为已失败那么返回的Promise实例就会变为已失败状态a’s

迭代器

迭代器设计的目的是为所有的数据结构提供一种统一的访问机制,即for…of循环,当使用该循环遍历某数据结构时,该循环会自动寻找迭代器接口,默认的迭代器接口部署在Symbol.iterator属性,该属性是一个迭代器对象生成函数.
next()
迭代器最根本的特征就是具有next方法,每次调用next方法都会返回一个代表当前成员的信息对象,具有value和done两个属性,当done属性为false时for…of循环就会停止

    let obj={
     
        [Symbol.iterator](){
     
            return{
     
                next(){
     
                    return{
     
                        value:
                        done:
                    }
                }
            }
        }
    }

默认实现迭代器的数据结构

• Array
• Map
• Set
• String
• TypedArray
• NodeList

Class

Class方式可以看作是构造函数的语法糖
语法

• 每个类必须有一个constructor方法,通过new命令生成对象时会自动调用该方法,如果没有显式定义一个空的方法会被自动添加,constructor方法默认返回this
• 类方法之间不再用逗号分隔,所有类方法实际定义在类的prototype属性上并且都是不可枚举的
• 可以使用get和set关键字设置某个属性的存取值函数
• 如果在一个类方法前面加上static关键字,就表示该方法不会被实例继承,而是直接通过类调用,静态方法中的this指的是类本身
• 实例属性可以写在constructor函数内,也可以写在构造函数的最顶层
• 如果在一个类属性前面加上static关键字,就表示该属性不会被实例继承,而是直接通过类调用

继承

• 可以通过extends关键字实现继承
• super关键字作为函数时指向父类的构造函数,在子类的constructor方法中必须调用super方法,并且只有在调用super方法后才能使用this关键字
• super关键字作为对象时在普通方法指向父类的原型对象,在静态方法中指向父类,当使用super关键字调用父类的方法时,方法中的this指向子类的实例
• super关键字作为对象时在静态方法中指向父类,当使用super关键字调用父类的方法时,方法中的this指向子类
• 子类的__proto__属性指向父类
• 子类的prototype属性的__proto__指向父类的prototype属性

Module

• 代码在模块作用域内运行,不是在全局作用域运行,模块内的顶层变量外部不可见
• 模块内部自动使用严格模式
• 模块中顶层this返回undefined,而不是指向window
• 多个模块如果加载多次只会执行一次

export命令

let a=1;
export{
     
  a
}
//or
export let a=1;
//or
export default a;//此方式导出的内容只能有一个

import命令

import {
     a} from "./a.js";
//or
import * as attrs from "./a.js";//此方式用于导入所有的可以导入的内容,封装到对象attrs中
//or
import newName from "./a.js";//此方式用于导入default导出的内容,可以不使用导出时的名字

import()函数

该函数支持动态加载模块,该函数参数为模块所在的位置,该函数发描绘一个Promise对象,import()加载模块成功后会将这个模块的接口作为一个对象并作then方法的参数,

浏览器加载规则

<script src="" type="module">script>

<script type="module">
//jsCode
script>

浏览器加载es模块要加上type="module"属性,凡是带有此属性的都是异步加载,如果网页有多个es6模块,他们会按照在浏览器出现的顺序依次执行