è¿æä¸ç§åå»ºå½æ°çæ¹æ³ãå®å¾å°è¢«ä½¿ç¨ï¼ä½æäºæ¶ååªè½éæ©å®ã
è¯æ³
åå»ºå½æ°çè¯æ³ï¼
let func = new Function ([arg1, arg2, ...argN], functionBody);
è¯¥å½æ°æ¯éè¿ä½¿ç¨åæ° arg1...argN åç»å®ç functionBody å建çã
ä¸é¢è¿ä¸ªä¾åå¯ä»¥å¸®å©ä½ çè§£åå»ºè¯æ³ãè¿æ¯ä¸ä¸ªå¸¦æä¸¤ä¸ªåæ°ç彿°ï¼
let sum = new Function('a', 'b', 'return a + b');
alert( sum(1, 2) ); // 3
è¿éæä¸ä¸ªæ²¡æåæ°ç彿°ï¼åªæå½æ°ä½ï¼
let sayHi = new Function('alert("Hello")');
sayHi(); // Hello
䏿们已ç¥çå ¶ä»æ¹æ³ç¸æ¯ï¼è¿ç§æ¹æ³æå¤§çä¸åå¨äºï¼å®å®é 䏿¯éè¿è¿è¡æ¶éè¿åæ°ä¼ éè¿æ¥çå符串å建çã
以åçææå£°ææ¹æ³é½éè¦æä»¬ ââ ç¨åºåï¼å¨èæ¬ä¸ç¼å彿°ç代ç ã
使¯ new Function å
许æä»¬å°ä»»æå符串åä¸ºå½æ°ãä¾å¦ï¼æä»¬å¯ä»¥ä»æå¡å¨æ¥æ¶ä¸ä¸ªæ°ç彿°å¹¶æ§è¡å®ï¼
let str = ... 卿尿¥æ¶æ¥èªæå¡å¨ç代ç ...
let func = new Function(str);
func();
ä½¿ç¨ new Function åå»ºå½æ°çåºç¨åºæ¯éå¸¸ç¹æ®ï¼æ¯å¦å¨å¤æç Web åºç¨ç¨åºä¸ï¼æä»¬éè¦ä»æå¡å¨è·åä»£ç æè
卿å°ä»æ¨¡æ¿ç¼è¯å½æ°æ¶æä¼ä½¿ç¨ã
éå
é常ï¼éå
æ¯æä½¿ç¨ä¸ä¸ªç¹æ®ç屿§ [[Environment]] æ¥è®°å½å½æ°èªèº«çå建æ¶çç¯å¢ç彿°ãå®å
·ä½æåäºå½æ°å建æ¶çè¯æ³ç¯å¢ãï¼æä»¬å¨ åéä½ç¨åï¼éå
ä¸ç« ä¸å¯¹æ¤è¿è¡äºè¯¦ç»ç讲解ï¼ã
使¯å¦ææä»¬ä½¿ç¨ new Function å建ä¸ä¸ªå½æ°ï¼é£ä¹è¯¥å½æ°ç [[Environment]] 并䏿åå½åçè¯æ³ç¯å¢ï¼èæ¯æåå
¨å±ç¯å¢ã
å æ¤ï¼æ¤ç±»å½æ°æ æ³è®¿é®å¤é¨ï¼outerï¼åéï¼åªè½è®¿é®å ¨å±åéã
function getFunc() {
let value = "test";
let func = new Function('alert(value)');
return func;
}
getFunc()(); // error: value is not defined
å°å ¶ä¸å¸¸è§è¡ä¸ºè¿è¡æ¯è¾ï¼
function getFunc() {
let value = "test";
let func = function() { alert(value); };
return func;
}
getFunc()(); // "test"ï¼ä» getFunc çè¯æ³ç¯å¢ä¸è·åç
new Function çè¿ç§ç¹æ§çèµ·æ¥æç¹å¥æªï¼ä¸è¿å¨å®é
ä¸å´é常å®ç¨ã
æ³è±¡ä¸ä¸æä»¬å¿ é¡»éè¿ä¸ä¸ªå符串æ¥å建ä¸ä¸ªå½æ°ãå¨ç¼åèæ¬æ¶æä»¬ä¸ä¼ç¥éè¯¥å½æ°ç代ç ï¼è¿ä¹å°±æ¯ä¸ºä»ä¹æä»¬ä¸ç¨å¸¸è§æ¹æ³åå»ºå½æ°ï¼ï¼ä½å¨æ§è¡è¿ç¨ä¸ä¼ç¥éäºãæä»¬å¯è½ä¼ä»æå¡å¨æå ¶ä»æ¥æºè·åå®ã
æä»¬çæ°å½æ°éè¦åä¸»èæ¬è¿è¡äº¤äºã
妿è¿ä¸ªå½æ°è½å¤è®¿é®å¤é¨ï¼outerï¼åé伿乿 ·ï¼
é®é¢å¨äºï¼å¨å° JavaScript åå¸å°ç产ç¯å¢ä¹åï¼éè¦ä½¿ç¨ å缩ç¨åºï¼minifierï¼ å¯¹å ¶è¿è¡å缩 ââ ä¸ä¸ªç¹æ®çç¨åºï¼éè¿å é¤å¤ä½ç注éåç©ºæ ¼çå缩代ç ââ æ´éè¦çæ¯ï¼å°å±é¨åéå½å为è¾ççåéã
ä¾å¦ï¼å¦æä¸ä¸ªå½æ°æ let userNameï¼å缩ç¨åºä¼æå®æ¿æ¢ä¸º let aï¼å¦æ a 已被å ç¨äºï¼é£å°±ä½¿ç¨å
¶ä»å符ï¼ï¼å©ä½çå±é¨åéä¹ä¼è¢«è¿è¡ç±»ä¼¼çæ¿æ¢ãä¸è¬æ¥è¯´è¿æ ·çæ¿æ¢æ¯å®å
¨çï¼æ¯ç«è¿äºå鿝彿°å
çå±é¨åéï¼å½æ°å¤çä»»ä½ä¸è¥¿é½æ æ³è®¿é®å®ãå¨å½æ°å
é¨ï¼å缩ç¨åºä¼æ¿æ¢ææä½¿ç¨äºè¿äºåéç代ç ãå缩ç¨åºå¾èªæï¼å®ä¼åæä»£ç çç»æï¼è䏿¯åæ¿å°æ¥æ¾ç¶åæ¿æ¢ï¼å æ¤å®ä¸ä¼âç ´åâä½ çç¨åºã
使¯å¨è¿ç§æ
åµä¸ï¼å¦æä½¿ new Function å¯ä»¥è®¿é®èªèº«å½æ°ä»¥å¤çåéï¼å®ä¹å¾æå¯è½æ æ³æ¾å°éå½åç userNameï¼è¿æ¯å 为æ°å½æ°çå建åçå¨ä»£ç å缩以åï¼åéåå·²ç»è¢«æ¿æ¢äºã
å³ä½¿æä»¬å¯ä»¥å¨ new Function ä¸è®¿é®å¤é¨è¯æ³ç¯å¢ï¼æä»¬ä¹ä¼åæ«äºå缩ç¨åºã
æ¤å¤ï¼è¿æ ·ç代ç 卿¶æä¸å¾å·®å¹¶ä¸å®¹æåºéã
彿们éè¦å new Function å建åºçæ°å½æ°ä¼ éæ°æ®æ¶ï¼æä»¬å¿
é¡»æ¾å¼å°éè¿åæ°è¿è¡ä¼ éã
æ»ç»
è¯æ³ï¼
let func = new Function ([arg1, arg2, ...argN], functionBody);
ç±äºåå²åå ï¼åæ°ä¹å¯ä»¥æéå·åé符çå½¢å¼ç»åºã
以ä¸ä¸ç§å£°æçå«ä¹ç¸åï¼
new Function('a', 'b', 'return a + b'); // åºç¡è¯æ³
new Function('a,b', 'return a + b'); // éå·åé
new Function('a , b', 'return a + b'); // éå·åç©ºæ ¼åé
ä½¿ç¨ new Function å建ç彿°ï¼å®ç [[Environment]] æåå
¨å±è¯æ³ç¯å¢ï¼è䏿¯å½æ°æå¨çå¤é¨è¯æ³ç¯å¢ãå æ¤ï¼æä»¬ä¸è½å¨ new Function ä¸ç´æ¥ä½¿ç¨å¤é¨åéãä¸è¿è¿æ ·æ¯å¥½äºï¼è¿æå©äºé使们代ç åºéçå¯è½ãå¹¶ä¸ï¼ä»ä»£ç æ¶æä¸è®²ï¼æ¾å¼å°ä½¿ç¨åæ°ä¼ 弿¯ä¸ç§æ´å¥½çæ¹æ³ï¼å¹¶ä¸é¿å
äºä¸ä½¿ç¨å缩ç¨åºè产çå²çªçé®é¢ã
è¯è®º
<code>æ ç¾æå ¥åªæå 个è¯ç代ç ï¼æå ¥å¤è¡ä»£ç å¯ä»¥ä½¿ç¨<pre>æ ç¾ï¼å¯¹äºè¶ è¿ 10 è¡ç代ç ï¼å»ºè®®ä½ ä½¿ç¨æ²ç®±ï¼plnkrï¼JSBinï¼codepenâ¦ï¼