前言
今天在搬砖的时候页面上有个根据传过来的算法通过js全局函数eval()进行计算的js需求 属实有被恶心到 今天博主就整理下JavaScript的全局函数 防止以后再被这种问题使绊子 也希望对大家有所帮助
一、JavaScript全局函数有哪些?
二、JavaScript全局函数详解?
2.1.Eval()
2.1.1.例子一
首先看示例:
eval("x=10;y=20;document.write(x*y)"); document.write("<br>" + eval("2+2")); document.write("<br>" + eval(x+17));
结果:
200
4
27
特殊用法{}:
document.write("<br>" + eval{3+3}));
这时返回结果为:6 我们发现{}这样使用和()其实是一样的 不同在于:
//{}/2 这种写法是不支持的 document.write("<br>" + eval{3+3}/2)); //()是可以的 document.write("<br>" + eval(3+3)/2)); //若是{}也想进行此类计算也可以 如下: document.write("<br>" + eval{(3+3)/2}));
2.1.2.例子二
看一下在其他情况中，eval() 返回的结果：
eval("2+3") // 返回 5 var myeval = eval; // 可能会抛出 EvalError 异常 myeval("2+3"); // 可能会抛出 EvalError 异常
可以使用下面这段代码来检测 eval() 的参数是否合法：
try { alert("Result:" + eval(prompt("Enter an expression:",""))); }catch(exception) { alert(exception); }
2.1.3.例子三(解析JSON字符串)
2.1.3.1.eval解析函数:
JSON 不允许包含函数，但你可以将函数作为字符串存储，之后再将字符串转换为函数。
var text = '{ "name":"Runoob", "alexa":"function () {return 10000;}", "site":"www.runoob.com"}'; var obj = JSON.parse(text); obj.alexa = eval("(" + obj.alexa + ")"); document.getElementById("demo").innerHTML = obj.name + " Alexa 排名：" + obj.alexa();
2.1.3.2.JSON字符串转换为对象的两种方法
//将JSON字符串转为JS对象的方法一 var obj = JSON.parse('{ "name":"runoob", "alexa":10000, "site":"www.runoob.com" }'); document.write(obj.name + "<br/>"); //将JSON字符串转为JS对象的方法二 //JSON格式的字符串 var test1 = '{"name":"qlq","age":25}'; var obj2 = eval("(" + test1 + ")"); //必须带圆括号 document.write(obj2.name + "<br/>" + obj2.age);
结果:
runoob
qlq
25
为什么要 eval这里要添加 eval("(" + test1 + “)”)//”呢？
原因在于：eval本身的问题。 由于json是以”{}”的方式来开始以及结束的，在JS中，它会被当成一个语句块来处理，所以必须强制性的将它转换成一种表达式。
加上圆括号的目的是迫使eval函数在处理JavaScript代码的时候强制将 括号内的表达式（expression）转化为对象，而不是作为语 句（statement）来执行。举一个例子，例如对象字面量{}，如若不加外层的括号，那么eval会将大括号识别为JavaScript代码块的开始 和结束标记，那么{}将会被认为是执行了一句空语句。所以下面两个执行结果是不同的：
alert(eval("{}"); // return undefined alert(eval("({})");// return object[Object]
对于这种写法，在JS中，可以到处看到。
如: (function()) {}(); 做闭包操作时等。
alert(dataObj.root.length);//输出root的子对象数量 $.each(dataObj.root,fucntion(idx,item){ if(idx==0){ return true; } //输出每个root子对象的名称和值 alert("name:"+item.name+",value:"+item.value); })
注：对于一般的js生成json对象，只需要将$.each()方法替换为for语句即可，其他不变。
2.1.3.3.对于服务器返回的JSON字符串，如果jquery异步请求将 type（一般为这个配置属性）设为"json"，或者利 用$.getJSON()方法获得服务器返回，那么就不需要eval()方法了，因为这时候得到的结果已经是json对象了，只需直接调用该对象即可，这里以$.getJSON方法为例说明数据处理方法：
$.getJSON("http://www.phpzixue.cn/",{param:"gaoyusi"},function(data){ //此处返回的data已经是json对象 //以下其他操作同第一种情况 $.each(data.root,function(idx,item){ if(idx==0){ return true;//同countinue，返回false同break } alert("name:"+item.name+",value:"+item.value); }); });
这里特别需要注意的是方式1中的eval()方法是动态执行其中字符串（可能是js脚本）的，这样很容易会造成系统的安全问题。所以可以采用一些规避了eval()的第三方客户端脚本库，比如JSON in JavaScript就提供了一个不超过3k的脚本库。
2.1.3.4.补充:eval()解析的JSON的key可以不带""
一般的JSON的key必须带双引号，也就是类似于{"key":"vslue"}的形式，但是如果用eval("("+json+")")的形式解析字符串为JSON的时候，json可以写为{key:"value"}
2.2.decodeURI()与 decodeURIComponent() – 解码函数
decodeURI() 可对 encodeURI() 函数编码过的 URI 进行解码
如:
const aaa = '#$ ￥%23ccc/' console.log(encodeURI(aaa)); // #$%20%EF%BF%A5%2523ccc/ console.log(decodeURI(aaa)); // #$ ￥%23ccc/ console.log(encodeURIComponent(aaa)); // %23%24%20%EF%BF%A5%2523ccc%2F console.log(decodeURIComponent(aaa)); // #$ ￥#ccc/
我们在获取地址栏参数是通常封装成如下函数：
export function getQueryObject(url) { url = url || window.location.href const search = url.substring(url.lastIndexOf('?') + 1) const obj = {} const reg = /([^?&=]+)=([^?&=]*)/g search.replace(reg, (rs, $1, $2) => { const name = decodeURIComponent($1) let val = decodeURIComponent($2) val = String(val) obj[name] = val return rs }) return obj }
2.3.encodeURI()与encodeURIComponent() — 编码函数
encodeURI():
语法
encodeURI(URIstring)
参数 描述
URIstring 必需。一个字符串，含有 URI 或其他要编码的文本。
返回值
URIstring 的副本，其中的某些字符将被十六进制的转义序列进行替换。
说明
该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ’ ( ) 。
该方法的目的是对 URI 进行完整的编码，因此对以下在 URI 中具有特殊含义的 ASCII 标点符号，encodeURI() 函数是不会进行转义的：;/?: @&=+$,#
encodeURIComponent() :
语法
encodeURIComponent(URIstring)
参数 描述
URIstring 必需。一个字符串，含有 URI 组件或其他要编码的文本。
返回值
URIstring 的副本，其中的某些字符将被十六进制的转义序列进行替换。
说明
该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ’ ( ) 。
其他字符（比如 ：;/?😡&=+$,# 这些用于分隔 URI 组件的标点符号），都是由一个或多个十六进制的转义序列替换的。
提示和注释
提示：请注意 encodeURIComponent() 函数 与 encodeURI() 函数的区别之处，前者假定它的参数是 URI 的一部分（比如协议、主机名、路径或查询字符串）。因此 encodeURIComponent() 函数将转义用于分隔 URI 各个部分的标点符号。
enCodeURI示例:
<html> <body> <script type="text/javascript"> document.write(encodeURI("http://www.w3school.com.cn")+ "<br />") document.write(encodeURI("http://www.w3school.com.cn/My first/")+ "<br />") document.write(encodeURI(",/?:@&=+$#")) </script> </body> </html>
输出结果：
http://www.w3school.com.cn/My%20first/
,/?: @&=+$#
对整个URL进行编码，而URL的特定标识符不会被转码。
encodeURIComponent() 示例:
<script type="text/javascript"> document.write(encodeURIComponent("http://www.w3school.com.cn")) document.write("<br />") document.write(encodeURIComponent("http://www.w3school.com.cn/p 1/")) document.write("<br />") document.write(encodeURIComponent(",/?:@&=+$#")) </script>
输出结果：
http%3A%2F%2Fwww.w3school.com.cn
http%3A%2F%2Fwww.w3school.com.cn%2Fp%201%2F
%2C%2F%3F%3A%40%26%3D%2B%24%23
对URL中的参数进行编码，因为参数也是一个URL，如果不编码会影响整个URL的跳转。
![[JS]同事：这次就算了，下班回去赶紧补补内置函数，再犯肯定被主管骂](https://ucc.alicdn.com/3mfxe2r26qbaq/developer-article1635463/20241109/c55917b4a28342b78633c9da58d86e30.png?x-oss-process=image/resize,h_160,m_lfit)
