문자열을 JavaScript 함수 호출로 바꾸는 방법? [복제]
이 질문에는 이미 답변이 있습니다.
나는 다음과 같은 문자열을 얻었다 :
settings.functionName + '(' + t.parentNode.id + ')';
다음과 같이 함수 호출로 변환하고 싶습니다.
clickedOnItem(IdofParent);
물론 이것은 JavaScript로 이루어져야합니다. 내가 경고 settings.functionName + '(' + t.parentNode.id + ')';
를하면 모든 것이 올바른 것 같습니다. 번역 할 함수를 호출하면됩니다.
전설:
settings.functionName = clickedOnItem
t.parentNode.id = IdofParent
내가 eval을 싫어하는 것을보고, 나는 혼자가 아닙니다 .
var fn = window[settings.functionName];
if(typeof fn === 'function') {
fn(t.parentNode.id);
}
편집 : @Mahan의 의견에 대한 답변 :이 특별한 경우에는 settings.functionName
입니다 "clickedOnItem"
. 이것은 런타임에로 변환 var fn = window[settings.functionName];
되어 var fn = window["clickedOnItem"]
에 대한 참조를 얻습니다 function clickedOnItem (nodeId) {}
. 변수 내부의 함수에 대한 참조가 있으면 "변수 호출"(즉 fn(t.parentNode.id)
, clickedOnItem(t.parentNode.id)
OP가 원했던 것과 같음 )을 통해이 함수를 호출 할 수 있습니다 .
더 자세한 예 :
/* Somewhere: */
window.settings = {
/* [..] Other settings */
functionName: 'clickedOnItem'
/* , [..] More settings */
};
/* Later */
function clickedOnItem (nodeId) {
/* Some cool event handling code here */
}
/* Even later */
var fn = window[settings.functionName];
/* note that settings.functionName could also be written
as window.settings.functionName. In this case, we use the fact that window
is the implied scope of global variables. */
if(typeof fn === 'function') {
fn(t.parentNode.id);
}
window[settings.functionName](t.parentNode.id);
eval () 필요 없음
범위를 지원하면서 동일한 작업을 수행하는보다 일반적인 방법은 다음과 같습니다.
// Get function from string, with or without scopes (by Nicolas Gauthier)
window.getFunctionFromString = function(string)
{
var scope = window;
var scopeSplit = string.split('.');
for (i = 0; i < scopeSplit.length - 1; i++)
{
scope = scope[scopeSplit[i]];
if (scope == undefined) return;
}
return scope[scopeSplit[scopeSplit.length - 1]];
}
그것이 일부 사람들을 도울 수 있기를 바랍니다.
JavaScript에는 eval
문자열을 평가하고 코드로 실행 하는 함수가 있습니다.
eval(settings.functionName + '(' + t.parentNode.id + ')');
eval ()은 그렇게하는 데 필요한 기능이지만 eval 사용을 최소화하기 위해 이러한 것들 중 하나를 시도하는 것이 좋습니다. 잘만되면 그들 중 하나가 당신에게 의미가있을 것입니다.
기능 저장
함수를 문자열이 아닌 함수로 저장하고 나중에 함수로 사용하십시오. 실제로 저장하는 기능은 귀하에게 달려 있습니다.
var funcForLater = clickedOnItem;
// later is now
funcForLater(t.parentNode.id);
또는
someObject.funcForLater = clickedOnItem;
// later is now
(someObject.funcForLater)(t.parentNode.id);
스토어 기능 이름
함수 이름을 문자열로 저장해야하는 경우에도 다음을 수행하여 복잡성을 최소화 할 수 있습니다.
(eval(settings.functionName))(t.parentNode.id);
구성하고 평가해야하는 Javascript의 양을 최소화합니다.
핸들러 사전
필요한 모든 동작 함수를 객체에 넣고 문자열을 사용하여 사전 스타일이라고합니다.
// global
itemActions = { click: clickedOnItem, rightClick: rightClickedOnItem /* etc */ };
// Later...
var actionName = "click"; // Or wherever you got the action name
var actionToDo = itemActions[actionName];
actionToDo(t.parentNode.id);
(사소한 참고 : 대신 구문 itemActions[actionName](t.parentNode.id);
을 사용 하면 함수가의 메소드로 호출됩니다 itemActions
.)
나는 첫 번째 대답을 좋아하고 평가를 싫어하지만 다른 방법 (평가와 유사)이 추가되어 주위를 둘러보고 사용할 수 없다면 더 잘하는 것이 좋습니다. 그러나 어떤 경우에는 일부 아약스 호출 전후에 자바 스크립트 코드를 호출 할 수 있으며 아약스 대신 사용자 정의 속성 에이 코드가있는 경우 다음을 사용할 수 있습니다.
var executeBefore = $(el).attr("data-execute-before-ajax");
if (executeBefore != "") {
var fn = new Function(executeBefore);
fn();
}
또는 여러 번 호출 해야하는 경우 결국 함수 캐시에 저장하십시오.
다시 말하지만 다른 방법이 있다면 eval 또는이 방법을 사용하지 마십시오.
경우 settings.functionName
함수가 이미, 당신이 할 수 있습니다 :
settings.functionName(t.parentNode.id);
그렇지 않으면 settings.functionName
함수의 이름 일 경우에도 작동 합니다.
if (typeof window[settings.functionName] == "function") {
window[settings.functionName](t.parentNode.id);
}
함수 이름을 문자열로 가져 와서 호출하고 함수에 인수를 전달하고 싶었습니다. 이 질문에 대해 선택된 답변을 얻지 못했지만이 답변 이 정확하게 설명했으며 여기에 간단한 데모가 있습니다.
function test_function(argument) {
alert('This function ' + argument);
}
functionName = 'test_function';
window[functionName]('works!');
이것은 또한 여러 인수와 함께 작동합니다.
기존의 기술 window['someFunctionName']()
이 처음에는 효과가 없었기 때문에 이를 이해하는 데 시간이 걸렸습니다 . 내 함수의 이름은 데이터베이스에서 AJAX 응답으로 가져 왔습니다. 또한 어떤 이유로 든 내 함수가 창 범위 밖에서 선언 되었으므로이 문제를 해결하려면 호출 한 함수를 다시 작성해야했습니다.
function someFunctionName() {}
에
window.someFunctionName = function() {}
거기서부터 window['someFunctionName']()
쉽게 전화 할 수있었습니다 . 나는 이것이 누군가를 돕기를 바랍니다!
나는 다음과 같은 것을 선호한다 :
window.callbackClass['newFunctionName'] = function(data) { console.log(data) };
...
window.callbackClass['newFunctionName'](data);
Nicolas Gauthier의 답변을 바탕으로 :
var strng = 'someobj.someCallback';
var data = 'someData';
var func = window;
var funcSplit = strng.split('.');
for(i = 0;i < funcSplit.length;i++){
//We maybe can check typeof and break the bucle if typeof != function
func = func[funcSplit[i]];
}
func(data);
예를 들어 node.js와 같은 CommonJS 사양을 사용하는 자바 스크립트에서 아래에 표시된 것을 수행 할 수 있습니다. window
객체 에 변수가 정의되어 있지 않아도 문자열로 변수에 액세스하는 데 매우 편리 합니다. MyClass
MyClass.js라는 CommonJS 모듈 내에 정의 된 이름의 클래스가있는 경우
// MyClass.js
var MyClass = function() {
// I do stuff in here. Probably return an object
return {
foo: "bar"
}
}
module.exports = MyClass;
그런 다음 MyOtherFile.js라는 다른 파일에서 멋진 요술을 할 수 있습니다.
// MyOtherFile.js
var myString = "MyClass";
var MyClass = require('./' + myString);
var obj = new MyClass();
console.log(obj.foo); // returns "bar"
CommonJS가 그토록 즐거움 인 이유 하나 더.
eval("javascript code");
JSON을 다룰 때 광범위하게 사용됩니다 .
참고 URL : https://stackoverflow.com/questions/912596/how-to-turn-a-string-into-a-javascript-function-call
'development' 카테고리의 다른 글
Vagrant는 .box 파일을 어디로 다운로드합니까? (0) | 2020.04.02 |
---|---|
높이가 아닌 이유 : 100 %가 div를 화면 높이로 확장합니까? (0) | 2020.04.02 |
이미지가 주어진 미로를 표현하고 해결하기 (0) | 2020.04.02 |
JavaScript에서 "어설 션"이란 무엇입니까? (0) | 2020.04.02 |
현재 시간을 어떻게 알 수 있습니까? (0) | 2020.04.02 |