类别JSONstringifyArrayflatflatMapStringtrimStart(trimLeft)/trimEnd(trimRight)matchAllES5方法一:RegExp.prototype.exec()和/g方法二:String.prototype。match()和/g方法三:String.prototype.replace()matchAllObjectfromEntriesofES10Example1Example2try.catchSymbolSymbol.prototype.descriptionBigIntES6-ES10学习布局因为ES10是对整体原型对象的增强和一些语法改进的修正,没有新的内容,是对原有内容的升级,有很多微妙的东西,所以写在了一起...JSONstringifyJSON.stringify修复了ES10中一些Unicode越界显示错误的问题.因为JSON编码成UTF-8,0xD800-0xDFFF之间的字符会因为无法编码成UTF-8而导致显示错误。升级后:在ES10中,将使用转义符来处理这些字符,而不是编码,所以可以正常显示。console.log(JSON.stringify('\u{D800}'))//"\ud800"JSON.stringify('\u{D800}')==='"\\ud800"'//trueArrayflat将数组Flattenoutput(降维处理)功能:会按照指定的深度递归遍历数组,将所有元素和遍历的子数组合并成一个新的数组。默认为一次返回。如果需要增加递归深度,那么要在flat中传递参数arr.flat(depth)letarr=[1,[2,3],[4,5,[6,7]]]console.log(arr.flat())//[1,2,3,4,5,[6,7]]//带参数,深度为2console.log(arr.flat(2))//[1,2,3,4,5,6,7]flatMap首先,什么是地图?letarray=[1,2,3]console.log(array.map(item=>item*2))//[2,4,6]flatMap相当于map+flat,如果需要映射这个数组first然后进行flat操作,可以直接使用flatMapconsole.log(array.flatMap(item=>[item*2]))//[2,4,6]//相当于下面的console.log(array.map(item=>[item*2]))//[[2],[4],[6]]console.log(array.map(item=>[item*2]).flat())//[2,4,6]MDN上有个例子可以说明两者的区别letarr=['今天天气不错','','早上好']arr.map(s=>s.split(''))//[["今天","日","日","齐","否","错"],[""],["早","上","好"]]啊。flatMap(s=>s.split(''))//["今天","日","日","齐","否","错","","早","上","OK"]StringtrimStart(trimLeft)/trimEnd(trimRight)trim是去除字符串空格的方法,这里是控制去除左边还是右边的空格letstr='foo'ES5//去掉开头和结尾的空格console.log(str.trim())//去掉前面的空格console.log(str.replace(/^\s+/g,''))//去掉字符串前后的空格console.log(str.replace(/^\s+|\s+$/g,''))ES10//去掉字符串前后的空格console.log(str.trimStart())//orconsole.log(str.trimLeft())//去掉字符串后面的空格console.log(str.trimEnd())//orconsole.log(str.trimRight())matchAllletstr=`"foo"and"bar"and"baz"`如何提取foo,bar,baz?ES5方法一:RegExp.prototype.exec()with/g因为match方法只能匹配一个,所以必须使用while循环进行全局匹配,否则每次functionselect(regExp,str){constmatches=[]//因为match方法只能匹配一个,所以使用while循环while(true){constmatch=regExp.exec(str)if(match===null)break//will捕获第一个输入到数组中matches.push(match[1])}returnmatches}//必须进行全局匹配,否则每次都从头开始匹配//括号是捕获的,只要是不是双引号,它们会被控制台捕获.log(select(/"([^"]*)"/g,str))//["foo","bar","baz"]写起来很麻烦像这样,还有其他方法吗?方法2:String.prototype.match()with/gconsole.log(str.match(/"([^"]*)"/g))//[""foo"",""bar",""baz""]上面的方法会丢掉所有的捕获,只取完整的匹配,所以每一个都有更多的双引号。方法三:圣ring.prototype.replace()functionselect(regExp,str){constmatches=[]//replace的高级用法,第二个参数可以传一个functionstr.replace(regExp,function(all,first){matches.push(first)})returnmatches}console.log(select(/"([^"]*)"/g,str))//["foo","bar","baz"]ES10的matchAllletstr=`"foo"and"bar"and"baz"`functionselect(regExp,str){constmatches=[]//matchAll返回所有可以遍历的匹配结果RegExpStringIterator{}//我们对所有的结果进行遍历for(constmatchofstr.matchAll(regExp)){matches.push(match[1])}returnmatches}console.log(select(/"([^"]*)"/g,str))//["foo","bar","baz"]ObjectfromEntries如何在对象和数组之间进行转换?对象到数组-条目数组到对象-fromEntriesfromEntries和条目是相对的,需要遵循固定格式//数组转对象——entriesconstobj={'foo':'a','bar':'b'}console.log(Object.entries(obj))//[["foo","a"],["bar","b"]]//数组转对象——fromEntriesconstarray=['foo','bar','baz']console.log(Object.fromEntries(array))//这样会报anerrorMustbeinafixedformat//正确的写法:constarray=[["foo","a"],["bar","b"]]console.log(Object.fromEntries(array))//{foo:"a",bar:"b"}示例1如果要访问[['foo',1],['bar',2]]数组中bar的值怎么办?ES5constarr=[['foo',1],['bar',2]]console.log(arr[1][1])//2ES10constarr=[['foo',1],['bar',2]]constobj=Object.fromEntries(arr)console.log(obj)//{foo:1,bar:2}console.log(obj.bar)//2例2下面的对象把字符串key中长度为3的内容被保留,其他的被删除。怎么做?constobj={abc:1,def:2,ghdsk:3}//然后把数组转成对象letres=Object.fromEntries(//entries先把object对象转成数组,然后过滤数组Object.entries(obj).filter(([key,val])=>key.length===3))console.log(res)//{abc:1,def:2}之前try.catch必须跟bycatch有一个e异常变量参数,有时候不需要try{...}catch(e){...}ES10可以去掉try{...}catch{...}后的括号符号。原型.description我们知道,Symbol的描述信息只保存在内部的[[Description]]中,并没有直接暴露给外界。只有在调用Symbol的toString()时才能读取到这个属性:constname=Symbol('Mynameisaxuebin')console.log(name.toString())//Symbol(Mynameisaxuebin)console.log(name)//Symbol(我叫axuebin)console.log(name==='Symbol(我叫axuebin)')//falseconsole.log(name.toString()==='Symbol(我叫axuebin)')//true现在可以通过description方法获取Symbol的描述信息:constname=Symbol('Mynameisaxuebin')console.log(name.description)//Mynameisaxuebinconsole.log(name.description==='Mynameisaxuebin')//我的名字是axuebinBigInt添加的第七种基本数据类型,用来处理除2以外的数字的53次方console.log(11n);//11nconsta=11nconsole.log(typeofa)//bigint是一个数字,可以操作console.log(typeof11)//numberPS:七种基本数据类型:String,Number,Boolean,Null,Undefined,Symbol,BigIntES6-ES10学习布局
