全局的对象或称为标准内置对象,不要和“全局对象”混淆,这里说的全局的对象是说在全局作用域里的对象。全局作用域中的其他对象可以由用户创建的脚本创建或由宿主程序提供。
Object
Object`:js中所有对象都是由Object构造函数创建的。它提供了对象的基本功能,包括属性访问。属性添加和删除、原型链等,可以使用new
Object()或对象字面量{}创建对象。
方法:
-
Object.assign(target,source1,source2):
将一个或多个源对象的属性复制到目标对象,并返回目标对象。let target={} let source1={name:'neflibata'} let source2={age:'20'}const res=Object.assign(target,source1,source2) console.log(res) //{name:'neflibata',age:'20'} console.log(target) //{name:'neflibata',age:'20'}
-
Object.keys(obj):
返回一个包含给定对象的所有可枚举属性名的数组const person={name:'neflibata',age:'20'} const keys=Object.keys(person) console.log(keys) //["name","age"]
-
Object.values(obj):
返回一个包含给定对象所有可枚举属性键值的数组const person={name:'neflibata',age:'20'} const values=Object.values(person) console.log(values) //['neflibata','20']
-
Object.entries(obj):
返回一个包含给定对象的所有可枚举属性键值对的数组。const person={name:'neflibata',age:'20'} const entries=Object.entries(person) console.log(entries) //[['name','neflibata'],['age',20']]
-
Object.getOwnPropertyDescriptor(obj,prop):
返回指定对象上一个属性的属性描述符const person={name:'neflibata',age:'20'} const descriptor=Object.getOwnPropertyDescriptor(person,'name'); console.log(descriptor) //{value: 'neflibata', writable: true, enumerable: true, configurable: true}
-
Object.defineProperty(obj,prop,descriptor):
定义或修改对象的属性,可以设置属性的特性,如可写性、可枚举性、可配置性等。 -
Object.create(proto,[propertiesObject]):
使用指定的原型对象创建一个新对象。 -
Object.getPrototypeOf(obj):
返回指定对象的原型对象。 -
Object.setPrototypeOf(obj,prototype):
设置一个对象的原型对象。
属性:
-
Object.prototype:
在所有对象中都存在的属性,表示Object对象的原型对象。 -
Object.prototype.constructor:
返回创建对象实例的函数引用。function Person(name){this.name=name } const person=new Person('neflibata') console.log(person.constructor===Person)//true
-
Object.prototype.toString():
返回表示对象的字符串。const person={name:'neflibata'} console.log(person.toString()) //"[object Object]"
-
Object.prototype.hasOwnProperty(prop):
判断对象是否具有指定属性(不包括原型链)。const person={name:'neflibata'} console.log(person.hasOwnProperty("name")) //true console.log(person.hasOwnProperty("age")) //false
-
Object.prototype.isPrototypeOf(obj):
判断对象是否是另一个对象的原型。const person={name:'neflibata'} const child=Object.create(person) console.log(person.isPrototypeOf(child)) //true
-
Object.prototype.propertyIsEnumerable(prop):
判断对象的属性是否可枚举。const person={name:'neflibata',age:'18'} console.log(person.propertyIsEnumerable("name")) //true console.log(person.propertyIsEnumerable('toString')) //false
- 对于
obj.propertyIsEnumerable('name')
,由于name
属性是直接在obj
对象上定义的,并且默认情况下可枚举,所以返回值为true
。 - 对于
obj.propertyIsEnumerable('toString')
,toString
属性是继承自原型链上的Object.prototype
对象的,而默认情况下大部分原型链上的属性是不可枚举的,所以返回值为false
。
Array
Array
:Array对象用于存储和操作一组值。它提供了许多操作数组的方法,如增加和删除元素、获取数组长度、遍历数组、排序等。可以使用new
Array()或数组字面量[]创建数组。
方法:
-
Array.length:
返回数组的长度(元素的个数)。 -
Array.push(element1,element2...):
将一个或多个元素添加到数组尾部,并返回新的数组长度。let array=[1,2,3,4,5] let len=array.push(6) console.log(len) //6
-
Array.pop():
移除并返回数组的最后一个元素。let array=[1,2,3,4,5] let popedElement=array.pop(); console.log(popedElement) //5
-
Array.unshift(element1,element2....)
:将一个或多个元素添加到数组的头部,并返回新的数组长度。let array=[1,2,3,4,5] arr.unshift(0) console.loh(array) //[0,1,2,3,4,5]
-
Array.shift():
移除数组第一个元素,返回值是被移除的元素。let array=[1,2,3,4,5] const shiftElement=array.shift() console.log(shiftElement) //1
-
Array.concat(arr1,arr2....):
合并多个数组,返回一个新的数组。let array=[1,2,3,4,5] let arr2=[6,7,8] const newArr=array.concat(arr2) console.log(newArr) //[1,2,3,4,5,6,7,8]
-
Array.join(separator):
将数组元素以特定的分隔符连接成一个字符串。let array=[1,2,3,4,5] let str=array.join('-') console.log(str) //1-2-3-4-5
-
Array.reverse():
反转数组中元素的顺序。let array=[1,2,3,4,5] array.reverse() console.log(array) //[5,4,3,2,1]
-
Array.slice(start,end):
提取数组中指定范围(索引范围[start,end-1])的数组,返回一个新的数组。let array=[1,2,3,4,5] let sliceArray=array.slice(1,3) console.log(sliceArray) //[2,3]
-
Array.splice(start,deleteCount,item1,item2....):
从数组中添加或删除元素,修改原数组。//情况一:删除对应索引值位置之后(包括该索引值位置)的元素 let array=[1,2,3,4,5] array.splice(1) console.log(array) //[1]//情况二:从倒数第几个(包括该位置)删除之后的所有元素 let array=[1,2,3,4,5] array.splice(-2) console.log(array) //[1,2,3]//情况三:从start索引开始(包括该位置)删除deleteCount个元素 let array=[1,2,3,4,5] array.splice(1,2) console.log(array) //[1,4,5]//情况四://当start>0//当deleteCount==0,不删除,在索引为start的位置前添加item1,item2...let array=[1,2,3,4,5]array.splice(1,0,6,7)console.log(array) //[1,6,7,2,3,4,5]//当deleteCount>0,从索引为start的位置删除(包括该位置)deleteCount个元素,同时将item1,item2...添加到该位置。let array=[1,2,3,4,5]array.splice(1,2,6,7)console.log(array) //[1,6,7,4,5]//当start<0//当deleteCount==0,不删除,在倒数第start的位置前添加item1,item2...等元素。let array=[1,2,3,4,5]array.splice(-2,0,6,7)console.log(array) //[1,2,3,6,7,4,5]//当deleteCount>0,从倒数第start的位置删除(包括该位置)deleteCount个元素,同时将item1,item2...添加到该位置。let array=[1,2,3,4,5]array.splice(-2,3,6,7)console.log(array) //[1,2,3,6,7]
-
Array.indexOf(searchElement,[,fromIndex]):
返回指定元素在数组中首次出现的索引,如果不存在就返回-1。let array=[1,2,3,4,5] let index=array.indexOf(2) console.log(index) //1
-
Array.lastIndexOf(searchElement,[,fromIndex]):
返回指定元素在数组中最后一次出现的索引,如果不存在返回-1。let array=[1,2,3,4,2,5] let index=array.lastIndexOf(2) console.log(index) //4
-
Array.includes(searchElement,[,fromIndex]):
判断数组中是否包含某个元素,返回布尔值。let array=[1,2,3,4,5] let res=array.includes(2) console.log(res) //true
-
Array.forEach(callback,[,thisArg]):
遍历数组中每个元素,执行指定的回调函数。(thisArg用于改变this指向)let array=[1,2,3,4,5] let res=array.includes(2) console.log(res) //true
-
Array.map(callback,[,thisArg]):
创建一个新数组,其中每个元素是调用回调函数的结果。let array=[1,2,3,4,5] let mapArray=array.map((element)=>element*2) console.log(mapArray) //[2, 4, 6, 8, 10]
-
Array.filter(callback,[,thisArg]):
创建一个新的数组,其中的每个元素是通过回调函数筛选出来的。let array=[1,2,3,4,5] let filterArray=array.filter(element=>element%2===0) console.log(filterArray) //[2,4]
-
Array.reduce(callback,[,initialValue]):
将数组元素按照特定的回调函数进行累积计算,返回最终结果。let array=[1,2,3,4,5] let reduceArray=array.reduce((accumulator,currentValue)=>{return accumulator*currentValue }) console.log(reduceArray) //120
-
Array.every(callback,[,thisArg]):
检测数组中所有元素是否都满足指定条件,返回布尔值。let array=[1,2,3,4,5] let everyRes=array.every(element=>element%2===0) console.log(everyRes) //false
-
Array.some(callback,[,thisArg]):
检测数组中是否至少有一个元素满足指定条件,返回布尔值。let array=[1,2,3,4,5] let someRes=array.some(element=>element%2===0) console.log(someRes) //true
属性:
Array.length:
返回数组的长度(元素个数)Array.prototype:
表示Array构造函数的原型对象,用于添加自定义的方法或属性。
String
String
:String对象表示字符串,它提供了许多处理字符串的方法,如查找子字符串、拼接字符串、分割字符串、替换字符串、转换大小写等。
方法:
-
charAt(index):
返回指定索引位置的字符let str='neflibata' console.log(str.charAt(1)) //'e'
-
**concat(str1,str2,…)😗*连接一个或者多个字符串,并返回新的字符串
let str1='hello' let str2='neflibata' console.log(str1,concat(',',str2)) //'hello,neflibata'
-
**indexOf(searchValue[,fromIndex])😗*返回指定字符或字符串在给定字符串中第一次出现的位置的索引,如果未找到,返回-1。
let str='hello neflibata' console.log(str.indexOf('neflibata')) //7
-
**lastIndexOf(searchValue[, fromIndex]):**返回指定字符串或字符在原始字符串中最后一次出现的索引。如果未找到该字符串,则返回 -1。
let str='hello neflibata' console.log(str.lastIndexOf('e')) //7
-
**toLowerCase()😗*将字符串转换为小写。
let str='HELLO NEFLIBATA' console.log(str.toLowerCase()) //hello neflibata
-
**toUpperCase()😗*将字符串转换为大写。
let str='hello neflibata' console.log(str.toUpperCase()) //HELLO NEFLIBATA
-
slice(startIndex[,endIndex]):
提取字符串中指定索引范围的部分,并返回新的字符串。let str = 'hello neflibata'; console.log(str.slice(6, 15)); // 输出: 'neflibata'
-
substr(startIndex[, length])
:从指定索引开始,提取指定长度的字符,并返回新的字符串。let str = 'hello neflibata'; console.log(str.substr(6, 9)); // 输出: 'neflibata'
-
substring(startIndex[, endIndex]):
提取字符串中指定索引范围的部分,并返回新的字符串。与 slice() 方法类似,但不支持负数索引。let str = 'hello neflibata'; console.log(str.substring(6, 9));
-
replace(searchValue, replaceValue):
将字符串中的指定值替换为新的值,并返回新的字符串。只替换第一个匹配项。let str = 'hello neflibata'; console.log(str.replace('hello', 'welcome')); //welcome neflibata
-
split(separator[, limit]):
将字符串拆分为子字符串数组,根据指定的分隔符进行拆分。str = 'hello,neflibata'; console.log(str.split(',')); ['hello','neflibata']
-
trim():
移除字符串两端的空白字符,并返回新的字符串。let str = ' hello neflibata '; console.log(str.replace('hello neflibata'));
属性:
- **length:**返回字符串的长度。
Number
Number
:Number对象表示数字,它提供了数值操作和转换的方法,如四舍五入、取绝对值、转换为字符串、转换为其他进制等。
属性:
-
Number.MAX_VALUE:
返回js中能表示的最大的数值。console.log(Number.MAX_VALUE); // 输出: 1.7976931348623157e+308
-
Number.MIN_VALUE:
返回js中能表示的最小的正数值(接近0)console.log(Number.MIN_VALUE); // 输出: 5e-324
-
Number.NaN:
表示非数字值console.log(Number.NaN); // 输出: NaN
-
Number.POSTIVE_INFINIY:
表示无穷大console.log(Number.POSITIVE_INFINITY); // 输出: Infinity
-
Number.NEGITIVE_INFNITY:
:表示负无穷大console.log(Number.NEGATIVE_INFINITY); // 输出: -Infinity
方法:
-
Number.isNaN(value):
检查一个值是否为NaN(非数字),返回布尔值。console.log(Number.isNaN(10)); // 输出: false console.log(Number.isNaN('neflibata')); // 输出: false console.log(Number.isNaN(NaN)); // 输出: true
-
Number.isFinite(value):
检查一个值是否为有限数值,返回布尔值。console.log(Number.isFinite(10)); // 输出: true console.log(Number.isFinite(Infinity)); // 输出: false
-
*
Number.parseInt(string,radix):
将字符串转换为整数,radix
表示进制,默认为10.console.log(Number.parseInt('10')); // 输出: 10 console.log(Number.parseInt('1010', 2)); // 输出: 10 (将二进制字符串 '1010' 转换为十进制数值)
-
Number.toFixed(digits):
将数字转换为指定小数位数的字符串。console.log(Number.parseFloat('3.14')); // 输出: 3.14
-
Number.toPrecision(precision):
将数字转换为指定精度的字符串表示。const num = 3.14159; console.log(num.toFixed(2)); // 输出: '3.14'
-
Number.toString(redix):
将数字转换为字符串,radix
表示进制,默认为10const num = 10; console.log(num.toString()); // 输出: '10' console.log(num.toString(2)); // 输出: '1010' (将十进制数值 10 转换为二进制字符串)
Boolean
Boolean
:Boolean对象表示布尔值,即true和false,它提供了布尔逻辑运算的方法,如与、或、非运算。
Date
Date
:Date对象用于处理日期和时间,它提供了创建日期对象,获取日期和时间、格式化日期和时间、进行日期计算等功能。
方法:
-
Date.now():
返回当前时间的时间戳,以毫秒为单位。console.log(Date.now()); // 1691627758019
-
new Date():
创建一个表示当前日期和时间的Date对象。const currentDate = new Date(); console.log(currentDate); //Thu Aug 10 2023 08:37:19 GMT+0800 (中国标准时间)
-
new Date(value):
创建一个表示指定时间的Date对象,value参数可以是一个表示日期和时间的字符串、时间戳或其他支持格式。const date1 = new Date('2023-08-10'); console.log(date1); // Thu Aug 10 2023 08:00:00 GMT+0800 (中国标准时间)const date2 = new Date(1691627758019); console.log(date2); //Thu Aug 10 2023 08:35:58 GMT+0800 (中国标准时间)const date3 = new Date(2023, 7, 10); console.log(date3); // Thu Aug 10 2023 00:00:00 GMT+0800 (中国标准时间)
-
getFullYear():
返回年份(四位数)。const date = new Date(); console.log(date.getFullYear()); //2023
-
getMonth():
返回月份,0表示一月,11表示12月。const date = new Date(); console.log(date.getMonth()); //7
-
getDate():
返回月份中的日期。const date = new Date(); console.log(date.getDate()); //10
-
getDay():
返回星期几,0表示星期日,1表示星期一。const date = new Date(); console.log(date.getDay()); // 4
-
getHours():
返回小时数(0-23)const date = new Date(); console.log(date.getHours()); // 8
-
getMinutes():
返回分钟数(0-59)const date = new Date(); console.log(date.getMinutes()); //43
-
getSeconds():
返回秒数(0-59)const date = new Date(); console.log(date.getSeconds()); //56
-
getTime():
返回表示日期的时间戳,以毫秒为单位。const date = new Date(); console.log(date.getTime()); //1691628253727
-
toLocaleString([locales[, options]]):
返回表示日期的本地化字符串。const date = new Date(); console.log(date.toLocaleString()); //2023/8/10 08:44:33
Math
Math:Math对象提供了数学运算和函数的方法。例如,它包含了常见的数学量(如
π)和函数(如三角函数、对数函数、幂函数),还提供了随机数生成、最大值、最小值获取等功能。
属性
-
Math.E
:返回自然对数的底数 e。console.log(Math.E); // 输出: 2.718281828459045
-
Math.PI
:返回圆周率 π。console.log(Math.PI); // 输出: 3.141592653589793
方法
-
Math.abs(x)
:返回数值 x 的绝对值。console.log(Math.abs(-10)); // 输出: 10
-
Math.ceil(x)
:对数值 x 进行上取整,返回大于或等于 x 的最小整数。console.log(Math.ceil(3.14)); // 输出: 4
-
Math.floor(x)
:对数值 x 进行下取整,返回小于或等于 x 的最大整数。console.log(Math.floor(3.14)); // 输出: 3
-
Math.round(x)
:对数值 x 进行四舍五入。console.log(Math.round(3.49)); // 输出: 3 console.log(Math.round(3.5)); // 输出: 4
-
Math.max(x1, x2, ...)
:返回一组数值中的最大值。console.log(Math.max(5, 10, 3)); // 输出: 10
-
Math.min(x1, x2, ...)
:返回一组数值中的最小值。console.log(Math.min(5, 10, 3)); // 输出: 3
-
Math.pow(x, y)
:返回 x 的 y 次幂。console.log(Math.pow(2, 3)); // 输出: 8
-
Math.sqrt(x)
:返回数值 x 的平方根。console.log(Math.sqrt(16)); // 输出: 4
-
Math.random()
:返回一个介于 0(包含)和 1(不包含)之间的随机数。console.log(Math.random()); // 输出: 一个随机数
-
Math.sin(x)
:返回数值 x 的正弦值。console.log(Math.sin(Math.PI / 2)); // 输出: 1
-
Math.cos(x)
:返回数值 x 的余弦值。console.log(Math.cos(Math.PI)); // 输出: -1
-
Math.tan(x)
:返回数值 x 的正切值。console.log(Math.tan(0)); // 输出: 0
RegExp
RegExp:RegExp对象表示正则表达式,用于进行字符串的模式匹配和替换。它提供了正则表达式的构建、匹配、替换的方法。
方法:
-
exec(string)
:在给定的字符串中执行正则表达式的匹配,并返回匹配结果的数组。如果没有匹配到,则返回 null。const regex = /abc/; const result = regex.exec('xyzabc123'); console.log(result); // 输出: ['abc', index: 3, input: 'xyzabc123', groups: undefined]const regex = /abc/; const result = regex.exec('abcxyzabc123'); ['abc', index: 0, input: 'abcxyzabc123', groups: undefined]
-
test(string)
:测试给定的字符串是否与正则表达式匹配,并返回布尔值。const regex = /abc/; console.log(regex.test('xyzabc123')); // 输出: true
-
match(regexp)
:在字符串中执行正则表达式的匹配,并返回匹配结果的数组。如果没有匹配到,则返回 null。const str = 'xyzabc123'; const result = str.match(/abc/); console.log(result); // 输出: ['abc', index: 3, input: 'xyzabc123', groups: undefined]
-
search(regexp)
:在字符串中搜索与正则表达式匹配的第一个位置,并返回匹配的索引。如果没有匹配到,则返回 -1。const str = 'xyzabc123'; console.log(str.search(/abc/)); // 输出: 3
-
replace(regexp, replacement)
:使用替换字符串或函数替换与正则表达式匹配的部分,并返回新的字符串。const str = 'Hello, World!'; const newStr = str.replace(/World/, 'JavaScript'); console.log(newStr); // 输出: 'Hello, JavaScript!'
-
split(regexp)
:根据正则表达式匹配的位置将字符串拆分为数组。const str = 'Hello, World!'; const arr = str.split(/,\s/); console.log(arr); // 输出: ['Hello', 'World!']
注意:
加不加g标志的区别:
-
全局匹配
:使用g
标志时,正则表达式会尝试在整个字符串中找到所有匹配项,而不仅仅是第一个匹配项。如果不使用g
标志,则只会找到第一个匹配项。const str = 'Hello, Hello, Hello!'; const regex = /Hello/;console.log(str.match(regex)); // 不加g标志,输出: ['Hello'] console.log(str.match(regexg)); // 加g标志,输出: ['Hello', 'Hello', 'Hello']
-
lastIndex 属性
:当使用g
标志时,RegExp 对象会维护一个lastIndex
属性,它记录了下一次匹配的起始位置。每次执行全局匹配后,lastIndex
会更新为下一次匹配的起始位置。如果不使用g
标志,则lastIndex
始终保持为 0。lastIndex 属性:当使用 g 标志时,RegExp 对象会维护一个 lastIndex 属性,它记录了下一次匹配的起始位置。每次执行全局匹配后,lastIndex 会更新为下一次匹配的起始位置。如果不使用 g 标志,则 lastIndex 始终保持为 0。
const str = 'Hello, Hello, Hello!'; const regex = /Hello/g;console.log(regex.lastIndex); // 输出: 0regex.exec(str); console.log(regex.lastIndex); // 输出: 5regex.exec(str); console.log(regex.lastIndex); // 输出: 11
-
String.prototype.match() 方法
:当正则表达式使用g
标志时,String.prototype.match()
方法将返回一个包含所有匹配项的数组。如果不使用g
标志,则返回的数组中只包含第一个匹配项及相关信息。const str = 'Hello, Hello, Hello!'; const regex = /Hello/g;console.log(str.match(regex)); // 输出: ['Hello', 'Hello', 'Hello']
-
String.prototype.replace() 方法
:当正则表达式使用g
标志时,String.prototype.replace()
方法将替换所有匹配项。如果不使用g
标志,则只会替换第一个匹配项。const str = 'Hello, Hello, Hello!'; const regex = /Hello/;console.log(str.replace(regex, 'Hi')); // 不加g标志,输出: 'Hi, Hello, Hello!' console.log(str.replace(regexg, 'Hi')); // 加g标志,输出: 'Hi, Hi, Hi!'
Function
Function:js中的函数也是一种对象,可以通过Function构造函数或函数字面量创建。函数对象可以被调用和传递,还提供了一些与函数相关的方法,如绑定上下文、定义默认参数等。
方法
-
Function.prototype.apply(thisArg, argsArray)
:调用函数并指定 this 值,以及作为数组(或类数组对象)提供的参数。其中,thisArg
是函数执行时的上下文对象,argsArray
是一个数组或类数组对象,包含要传递给函数的参数。function greet(name) {console.log(`Hello, ${name}!`); }greet.apply(null, ['Alice']); // 输出: 'Hello, Alice!'
-
Function.prototype.call(thisArg, arg1, arg2, ...)
:调用函数并指定 this 值,以及作为参数传递给函数的参数列表。其中,thisArg
是函数执行时的上下文对象,arg1
、arg2
等是要传递给函数的参数。function greet(name) {console.log(`Hello, ${name}!`); }greet.call(null, 'Alice'); // 输出: 'Hello, Alice!'
-
Function.prototype.bind(thisArg, arg1, arg2, ...)
:创建一个新函数,将原始函数绑定到指定的 this 值和初始参数。返回的新函数可以在稍后的调用中使用。function greet(name) {console.log(`Hello, ${name}!`); }const boundGreet = greet.bind(null, 'Alice'); boundGreet(); // 输出: 'Hello, Alice!'
-
Error:Error对象用于表示错误。它是一种异常情况的标志,可以通过throw关键字跑出并通过try…catch语句进行捕获和处理。
除了上述对象,还有其他的一些特殊内置对象
Global
Global
:在浏览器环境中,window对象是全局对象,它包含了浏览器提供的全局属性和方法。在Node.js环境中,global对象扮演类的角色。
Promise
Promise
:Promise对象用于处理异步操作。它提供了一种处理异步任务的方式,可以通过链式调用来处理异步操作的结果。
- Promise是异步编程的一种解决方案,它就是一个容器,里面保存着某个未来才会结束的事件的结果,从语法上说,Promise就是一个对象,从他可以获取异步操作的消息
- Promise对象的特点
- 对象的状态不受外界的影响:Promise对象代表一个异步操作,有三种状态:pending、fullfilled、rejected,只有异步操作的结果可以决定当前是哪一种状态,任何其他操作都无法改变这个状态
- 一旦改变,就不会再变,任何时候都可以得到这个结果
-
Promise.resolve()
将现有对象转为Promise对象
Promise.resolve('foo') //等价于 new Promise(resolve=>resolve('foo'))
参数:
-
是一个Promise实例
- 如果参数是Promise实例,那么Promise.resolve将不做任何修改,原封不动地返回这个实例
-
是一个thenable对象
- thenable对象指的是具有then方法的对象,如:
let thenable={then:function(resolve,reject){resolve(42)} }
- Promise.resolve方法会将这个对象转为Promise对象,然后就立即执行thneable对象的then方法
-
不是具有then方法的对象,或根本就不是对象
-
- Promise.resolve方法返回一个新的Promise对象,状态为resolved
const p=Promise.resolve('hello') p.then((s)=>{console.log(s) })
-
-
不带有任何参数
-
Promise.resolve()方法允许调用时不带参数,直接返回一个resolved状态的Promise对象
-
如果希望得到一个Promise对象,比较方便的方法就是直接调用Promise.resolve()方法,如下:
const p=Promise.resolve(); p.then(()=>{//... })
-
立即resolve()的Promise对象,是在本轮“事件循环”(event loop)的结束时执行,而不是在下一轮“事件循环”的开始时
setTimeout(function () {console.log('three'); }, 0); Promise.resolve().then(function () {console.log('two'); }); console.log('one'); // one // two // three
js的执行顺序:先同步再异步
异步中任务队列的执行顺序:先微任务队列,再宏任务队列
Promise中的resolve、reject属于微任务队列,settimeout属于宏任务队列
-
-
Promise.reject()
Promise.reject(reason)方法也会返回一个新的Promise实例,该实例的状态是rejected
const p=Promise.reject('出错了')
//等价于
const p=new Promise((resolve,reject)=>{reject("出错了")
})
p.then(null,(s)=>{console.log(s)//出错了
})
-
Promise.reject()方法的参数,会原封不动地作为reject的理由,变成后续方法的参数
const thenable={then(resolve,reject){reject("出错了")} }Promise.reject(thenable) .catch(e=>{console.log(e===thenable)//true })
Promise.try()
让同步函数同步执行,异步函数异步执行,并让它们具有统一的·API
有两种写法:
async函数
const f=()=>console.log('now')
(async()=>f())()//同步函数写法
(async()=>f())().then(...)//异步函数写法
console.log('next')//now
//next
new Promise()
const f=()=>console.log('now')
(()=>new Promise(resolve=>resolve(f()))
)()
cosole.log('next')
//now
//next
-
上面代码使用的是立即执行的匿名函数,执行new Promise(),这种情况下,同步函数也是同步执行的。
-
还可以用Promise.try方法代替上面的写法
const f=()=>console.log('now') Promise.try(f) console.log('next') //now //next
-
还可以统一用peomise.catch()捕获所有同步和异步的错误
Promise.try(() => database.users.get({id: userId})).then(...).catch(...)
Promise.all()
Promise.all()方法用于将多个Promise实例,包装成一个新的Promise实例。
const p=Promise.all([p1,p2,p3])
-
Promise.all()的参数可以不是数组,但必须有Iterator接口,且返回的每个成员都是Pomise实例
-
p的状态由p1、p2、p3决定,分成两种情况
-
只有p1、p2、p3的状态都变成fullfilled,p的状态才会变成fullfilled,此时p1、p2、p3的返回值组成一个数组,传递给p的回调函数
-
只要p1、p2、p3之中有一个被rejected,p的状态就变成rejected,此时第一个被reject的实例的返回值,会传递给p的回调函数
const databasePromise = connectDatabase(); const booksPromise = databasePromise.then(findAllBooks); const userPromise = databasePromise.then(getCurrentUser); Promise.all([booksPromise,userPromise ]) .then(([books, user]) => pickTopRecommendations(books, user));
注意
:如果参数中有Promise实例并且自己定义了catch方法,那么它一旦被rejected,并不会触发Promise.all()的catch方法
-
Promise.race()
Promise.race()方法同样是将多个Promise实例,包装成一个新的Promise实例
const p=Promise.race([p1,p2,p3])
上面代码中,只要p1、p2、p3之中有一个实例率先改变状态,p的状态就跟着改变,率先改变的Promise实例的返回值传递给p的回调函数。
Promise.all()方法的参数与Promise.all()方法的一样,如果不是Promise实例,就会先调用Promise.resolve方法,将参数转为Promise实例
const p = Promise.race([fetch('/resource-that-may-take-a-while'),new Promise(function (resolve, reject) {setTimeout(() => reject(new Error('request timeout')), 5000)})
]);
p
.then(console.log)
.catch(console.error);
- 上面代码中race有两个参数:fetch(‘/resource-that-may-take-a-while’)和new Promise(function (resolve, reject) {
setTimeout(() => reject(new Error(‘request timeout’)), 5000)
}),如果在5秒之内第一个函数没有返回结果,就会因为执行第二个函数,导致Promise的状态变为reject
Promise.allSettled()
Promise.allSettled()方法接受一组Promise实例作为参数,包装成一个新的Promise实例,只有等到所有这些参数实例都返回结果,不管是fullfilled还是rejected,包装实例才会结束。当我们不关心异步操作的结果,只关心这些操作有没有结束,这时,Promise.allSettled()方法就派上用场了。
Promise.any()
Promise.any()方法接收一组Promise实例作为参数,包装成一个新的Promise实例,只要有一个参数实例变成fullfilled状态,包装实例就会变成fullfilled状态,如果所有参数实例都变成rejected状态,包装实例就会变成rejected状态,Promise的状态总是fullfilled。
区分:
在这里我们区分一下Promise.all()
、Promise.race()
、Promise.allSettled()
、Promise.any()
:
- **Promise.all()😗*参数实例状态都变成fullfilled,Promise的状态才会变成fullfilled,只要有一个变成rejected,Promise的状态就会变成rejected。
- **Promise.race():**参数实例率先改变状态的,Promise的状态会跟着改变。
- **Promise.allSettled():**当参数实例发出的请求结束时,不管其是fullfilled还是rejected,Promise的状态总是fullfilled
- **Promise.any():**只要有一个参数实例变成fullfilled,Promise状态就会变成fullfilled,如果所有参数实例状态都变成rejected状态,Promise状态就会变成rejected
Symbol
Symbol
:Symbol对象表示唯一的标识符,它可以用作对象的属性键,以确保属性的唯一性。
Symbol
是 JavaScript 中的一种基本数据类型,用于表示唯一的标识符。它的主要特点是创建的每个Symbol
值都是唯一的,不会与其他任何值相等。Symbol
可以用作对象属性的键,提供一种避免命名冲突的机制。下面是Symbol
的一些用法:
- 创建
Symbol
可以使用 Symbol()
函数来创建一个新的 Symbol
值。
const mySymbol = Symbol();
console.log(typeof mySymbol); // 输出: 'symbol'
Symbol
函数还可以接受一个可选的描述参数,用于标识该 Symbol
的描述信息。
const mySymbol = Symbol('My Symbol');
console.log(mySymbol.toString()); // 输出: 'Symbol(My Symbol)'
- 作为对象属性键
Symbol
可以用作对象属性的键,确保属性名的唯一性,防止命名冲突。
const obj = {};
const mySymbol = Symbol();obj[mySymbol] = 'Hello';
console.log(obj[mySymbol]); // 输出: 'Hello'
- 内置的
Symbol
值
JavaScript 提供了许多内置的
Symbol
值,用于表示语言内部的特定行为或属性。这些内置的Symbol
值可以通过全局的Symbol
属性访问。
- Symbol.iterator:表示对象的默认迭代器方法。
- Symbol.species:用于指定派生对象的构造函数。
- Symbol.match:用于指定对象用于匹配的正则表达式方法。
- Symbol.hasInstance:用于确定对象是否为构造函数的实例。
- Symbol.toStringTag:用于自定义对象的
toString()
方法返回的字符串标签。
Map和Set
Map和Set
:Map对象用于存储键值对,而Set对象用于存储唯一值。它提供了添加、删除、遍历等操作方法。
-
Map 的方法和属性
Map.prototype.size
:返回Map
对象中键值对的数量。Map.prototype.set(key, value)
:向Map
对象中添加指定的键值对。Map.prototype.get(key)
:返回指定键对应的值。Map.prototype.has(key)
:判断指定的键是否存在于Map
对象中。Map.prototype.delete(key)
:从Map
对象中删除指定的键值对。Map.prototype.clear()
:清空Map
对象中的所有键值对。Map.prototype.forEach(callback[, thisArg])
:遍历Map
对象中的键值对,并执行提供的回调函数。
const map = new Map();map.set('key1', 'value1'); map.set('key2', 'value2');console.log(map.size); // 输出: 2console.log(map.get('key1')); // 输出: 'value1'console.log(map.has('key1')); // 输出: truemap.delete('key1');map.forEach((value, key) => {console.log(key, value); });
-
Set 的方法和属性:
Set.prototype.size
:返回Set
对象中值的数量。Set.prototype.add(value)
:向Set
对象中添加指定的值。Set.prototype.has(value)
:判断指定的值是否存在于Set
对象中。Set.prototype.delete(value)
:从Set
对象中删除指定的值。Set.prototype.clear()
:清空Set
对象中的所有值。Set.prototype.forEach(callback[, thisArg])
:遍历Set
对象中的值,并执行提供的回调函数。Set.prototype.values()
:返回一个新的迭代器对象,包含Set
对象中的所有值。Set.prototype.keys()
:与values()
方法相同,返回一个新的迭代器对象,包含Set
对象中的所有值。Set.prototype.entries()
:返回一个新的迭代器对象,包含Set
对象中的所有键值对。
const set = new Set();set.add('value1'); set.add('value2');console.log(set.size); // 输出: 2console.log(set.has('value1')); // 输出: trueset.delete('value1');set.forEach((value) => {console.log(value); });const valuesIterator = set.values(); console.log(valuesIterator.next().value); // 输出: 'value2'const entriesIterator = set.entries(); console.log(entriesIterator.next().value); // 输出: ['value2', 'value2']
TypedArray
TypedArray
:TypedArray 是 JavaScript
中一组特定类型的数组,它们提供了以固定内存大小和相应的数据类型存储二进制数据的能力。
以下是 TypedArray 对象的常用属性和方法:
-
TypedArray 对象的属性:
TypedArray.prototype.buffer
:返回当前 TypedArray 对象的底层 ArrayBuffer 对象。TypedArray.prototype.byteLength
:返回当前 TypedArray 对象的字节长度。TypedArray.prototype.byteOffset
:返回当前 TypedArray 对象相对于底层 ArrayBuffer 对象的字节偏移量。TypedArray.BYTES_PER_ELEMENT
:返回当前 TypedArray 对象中每个元素的字节大小。
-
TypedArray 对象的方法:
TypedArray.prototype.length
:返回当前 TypedArray 对象的元素个数。TypedArray.prototype.copyWithin(target, start[, end])
:将 TypedArray 对象中指定范围的元素复制到指定位置。TypedArray.prototype.fill(value[, start[, end]])
:将 TypedArray 对象中指定范围的元素填充为指定的值。TypedArray.prototype.find(callback[, thisArg])
:返回满足指定测试函数的第一个元素的值。TypedArray.prototype.findIndex(callback[, thisArg])
:返回满足指定测试函数的第一个元素的索引。TypedArray.prototype.forEach(callback[, thisArg])
:对 TypedArray 对象的每个元素执行指定的回调函数。TypedArray.prototype.includes(searchElement[, fromIndex])
:判断 TypedArray 对象是否包含指定元素。TypedArray.prototype.indexOf(searchElement[, fromIndex])
:返回指定元素在 TypedArray 对象中的第一个匹配索引。TypedArray.prototype.join([separator])
:将 TypedArray 对象的所有元素连接为字符串。TypedArray.prototype.map(callback[, thisArg])
:对 TypedArray 对象的每个元素执行指定的回调函数,并返回结果组成的新 TypedArray 对象。TypedArray.prototype.reduce(callback[, initialValue])
:对 TypedArray 对象的元素依次执行指定的回调函数,返回一个累积的结果。TypedArray.prototype.reverse()
:将 TypedArray 对象的元素顺序反转。TypedArray.prototype.slice([start[, end]])
:返回指定范围内的元素组成的新 TypedArray 对象。TypedArray.prototype.sort([compareFunction])
:对 TypedArray 对象的元素进行排序。TypedArray.prototype.subarray([begin[, end]])
:返回指定范围内的元素组成的新 TypedArray 对象的视图。TypedArray.prototype.toLocaleString([locales[, options]])
:返回 TypedArray 对象的元素的本地化字符串表示。TypedArray.prototype.toString()
:返回 TypedArray 对象的字符串表示。TypedArray.prototype.values()
:返回一个新的迭代器对象,包含 TypedArray 对象的所有值。
// 创建一个 Int16Array 对象 const intArray = new Int16Array([1, 2, 3, 4, 5]);console.log(intArray.buffer); // 输出: ArrayBuffer { [Int16Contents]: <00 01 00 02 00 03 00 04 00 05> } console.log(intArray.byteLength); // 输出: 10 console.log(intArray.byteOffset); // 输出: 0 console.log(Int16Array.BYTES_PER_ELEMENT); // 输出: 2console.log(intArray.length); // 输出: 5// 使用 copyWithin 方法复制元素 intArray.copyWithin(2, 0, 2); console.log(intArray); // 输出: Int16Array [ 1, 2, 1, 2, 5 ]// 使用 fill 方法填充元素 intArray.fill(0, 3); console.log(intArray); // 输出: Int16Array [ 1, 2, 1, 0, 0 ]// 使用 find 方法查找元素 const foundElement = intArray.find(element => element > 1); console.log(foundElement); // 输出: 2// 使用 forEach 方法遍历元素 intArray.forEach(element => {console.log(element); });// 使用 includes 方法判断元素是否存在 console.log(intArray.includes(3)); // 输出: false// 使用 indexOf 方法查找元素的索引 console.log(intArray.indexOf(1)); // 输出: 0// 使用 join 方法将元素连接为字符串 console.log(intArray.join('-')); // 输出: '1-2-1-0-0'// 使用 map 方法对元素进行操作 const mappedArray = intArray.map(element => element * 2); console.log(mappedArray); // 输出: Int16Array [ 2, 4, 2, 0, 0 ]// 使用 reduce 方法对元素进行累加 const sum = intArray.reduce((accumulator, currentValue) => accumulator + currentValue); console.log(sum); // 输出: 4// 使用 sort 方法对元素进行排序 intArray.sort(); console.log(intArray); // 输出: Int16Array [ 0, 0, 1, 1, 2 ]
JSON
JSON
:JSON对象提供了JSON格式的解析和序列化方法。它可以将js对象转化为JSON字符串,以及将JSON字符串转化为js对象。
JSON 方法:
JSON.parse(text[, reviver])
:将 JSON 字符串解析为 JavaScript 对象。可选的reviver
参数是一个函数,用于在解析过程中对结果进行转换或修改。JSON.stringify(value[, replacer[, space]])
:将 JavaScript 值转换为 JSON 字符串。可选的replacer
参数是一个函数或数组,用于选择性地过滤和转换对象的属性。可选的space
参数是一个用于格式化输出的空格字符串或空格数量。
JSON 属性:
JSON.stringify(value[, replacer[, space]]).length
:返回表示 JSON 字符串的长度。
const jsonStr = '{"name": "neflibata", "age": 20, "city": "New York"}';// 解析 JSON 字符串
const jsonObject = JSON.parse(jsonStr);
console.log(jsonObject); // {name: 'neflibata', age: 20, city: 'New York'}// 将 JavaScript 对象转换为 JSON 字符串
const jsonString = JSON.stringify(jsonObject);
console.log(jsonString); // {"name":"neflibata","age":20,"city":"New York"}// 将 JavaScript 对象转换为格式化的 JSON 字符串
const formattedJsonString = JSON.stringify(jsonObject, null, 2);
console.log(formattedJsonString);
//{
// "name": "neflibata",
// "age": 20,
// "city": "New York"
//}// 使用 replacer 参数选择性地过滤和转换属性
const filteredJsonString = JSON.stringify(jsonObject, ['name', 'age']);
console.log(filteredJsonString); //{"name":"neflibata","age":20}// 使用 replacer 参数转换属性值
const transformedJsonString = JSON.stringify(jsonObject, (key, value) => {if (key === 'age') {return value * 2;}return value;
});
console.log(transformedJsonString); //{"name":"neflibata","age":40,"city":"New York"}// 获取 JSON 字符串的长度
const jsonStringLength = JSON.stringify(jsonObject).length;
console.log(jsonStringLength); // 47