当前位置: 首页 > 科技观察

你需要深入了解JavaScript的新Function

时间:2023-03-16 00:33:53 科技观察

1。语法如下:letfunc=newFunction([arg1,arg2,…argN],functionBody);最后一个参数必须是函数体,其余参数传递给函数体参数。例如:letsum=newFunction('a','b','returna+b');console.log(sum(1,2));//结果是3我们通常开发JavaScript或Node.js,没有理由使用newFunction构造函数,因为不需要直接使用函数或()=>{}箭头函数。这是否意味着新的Function语法是一个错误的函数?不要这样想!因为它绝对不是你想的那样!新的Function语法有一个特别强大的特性,这使得它在JavaScript中无可替代。有什么特点?也就是函数体的数据格式是字符串,不可思议!不可替代的角色这里有几个例子来展示新函数语法的微妙之处。1).使无效的JSON对象字符串合法化。例如有如下字符串:letstr=`{"id":103,name:'yh','date':'2022–07–06'}`;where中的字符串不符合JSON格式(键值需要双引号),用JSON.parse()解析会报错。那么,有没有办法将这个字符串对象转换成可解析的JSON呢?很多人想到正则匹配然后替换,或者使用eval等scum属性进行处理。不用这么麻烦,新功能上线,完美!JS代码如下:console.log(JSON.stringify(newFunction('return'+str)()));//返回结果为:'{"id":10393,"name":"yh","date":"2022–07–06"}'使用返回语法,您可以轻松地将任何字符串转换为其他JavaScript数据类型。2).模板字符串作为Vue、React等模板,现在有自己的模板语法,例如{}语法。如果我们想直接使用ES6自带的语法作为模板语言,就必须使用newFunction的能力,比如下面的HTML:return`

文章:${obj.article}

作者:${obj.author}

`;}).join('')}我们可以展开字符串并定义一个名为interpolate的字符串方法,将ES6语法字符串转换为可执行的ES6代码:String.prototype.interpolate=function(params){constnames=Object.keys(params);constvals=Object.values(params);returnnewFunction(...names,`return\`${this}\`;`)(...vals);};至此,只要有相应的数据,我们就可以根据