1. 程式人生 > >動態通過變數名來呼叫函式

動態通過變數名來呼叫函式

最近在做一個監控視覺化介面,裡面包含了很多的板塊,對於不同板塊需要呼叫不同的函式來生成對應的介面,由於生成介面函式需要傳遞很多引數,剛開始自己通過各種switch語句來監測呼叫是哪個函式,但是感覺寫了很長一段程式碼才解決,後來自己看了一下有沒有簡潔方法,寫一個通類,讓它自動呼叫,程式碼如下:

var typeStr = '';
function getName(type) {
    typeStr = type[0].toUpperCase();
    for(var i=1; i<type.length; i++) {
        typeStr += type[i];
    }
};
getName(type);
var draw = 'draw' + typeStr;
function drawE(fnName) {
    if(typeof(eval(fnName) == 'function')) {
        var fn = eval(fnName + '(myChart,pos,data);')
    }
};
drawE(draw);

這裡主要處理的是對於type變數的判斷來呼叫不同函式,節省程式碼如下:(可以忽略,只是看看它的威力有多大)

/*
* switch (pos) { case 'l1': switch (type) { case 'bar':
* setTimeout(function() { drawBar(myChart, 'l1', data); }, 200) break; case
* 'star': setTimeout(function() { drawStar(myChart, 'l1', data) }, 200)
* break; case 'grid': setTimeout(function() { drawGrid(myChart, 'l1', data) },
* 200) break; case 'pie': setTimeout(function() { drawPie(myChart, 'l1',
* data) }, 200) break; case 'line': setTimeout(function() {
* drawLine(myChart, 'l1', data) }, 200) break; case 'area':
* setTimeout(function() { drawArea(myChart, 'l1', data) }, 200) break; case
* 'dashboard': setTimeout(function() { drawDashboard(myChart, 'l1', data) },
* 200) break; case 'funnel': setTimeout(function() { drawFunnel(myChart,
* 'l1', data) }, 200) break; }; break; case 'l2': switch (type) { case
* 'bar': setTimeout(function() { drawBar(myChart, 'l2', data) }, 200)
* break; case 'star': setTimeout(function() { drawStar(myChart, 'l2', data) },
* 200) break; case 'grid': setTimeout(function() { drawGrid(myChart, 'l2',
* data) }, 200) break; case 'pie': setTimeout(function() { drawPie(myChart,
* 'l2', data) }, 200) break; case 'line': setTimeout(function() {
* drawLine(myChart, 'l2', data) }, 200) break; case 'area':
* setTimeout(function() { drawArea(myChart, 'l2', data) }, 200) break; case
* 'dashboard': setTimeout(function() { drawDashboard(myChart, 'l2', data) },
* 200) break; case 'funnel': setTimeout(function() { drawFunnel(myChart,
* 'l2', data) }, 200) break; }; break; case 'l3': switch (type) { case
* 'bar': setTimeout(function() { drawBar(myChart, 'l3', data) }, 200)
* break; case 'star': setTimeout(function() { drawStar(myChart, 'l3', data) },
* 200) break; case 'grid': setTimeout(function() { drawGrid(myChart, 'l3',
* data) }, 200) break; case 'pie': setTimeout(function() { drawPie(myChart,
* 'l3', data) }, 200) break; case 'line': setTimeout(function() {
* drawLine(myChart, 'l3', data) }, 200) break; case 'area':
* setTimeout(function() { drawArea(myChart, 'l3', data) }, 200) break; case
* 'dashboard': setTimeout(function() { drawDashboard(myChart, 'l3', data) },
* 200) break; case 'funnel': setTimeout(function() { drawFunnel(myChart,
* 'l3', data) }, 200) break; }; break; case 'b1': switch (type) { case
* 'bar': setTimeout(function() { drawBar(myChart, 'b1', data) }, 200)
* break; case 'star': setTimeout(function() { drawStar(myChart, 'b1', data) },
* 200) break; case 'grid': setTimeout(function() { drawGrid(myChart, 'b1',
* data) }, 200) break; case 'pie': setTimeout(function() { drawPie(myChart,
* 'b1', data) }, 200) break; case 'line': setTimeout(function() {
* drawLine(myChart, 'b1', data) }, 200) break; case 'area':
* setTimeout(function() { drawArea(myChart, 'b1', data) }, 200) break; case
* 'dashboard': setTimeout(function() { drawDashboard(myChart, 'b1', data) },
* 200) break; case 'funnel': setTimeout(function() { drawFunnel(myChart,
* 'b1', data) }, 200) break; }; break; case 'b2': switch (type) { case
* 'bar': setTimeout(function() { drawBar(myChart, 'b2', data) }, 200)
* break; case 'star': setTimeout(function() { drawStar(myChart, 'b2', data) },
* 200) break; case 'grid': setTimeout(function() { drawGrid(myChart, 'b2',
* data) }, 200) break; case 'pie': setTimeout(function() { drawPie(myChart,
* 'b2', data) }, 200) break; case 'line': setTimeout(function() {
* drawLine(myChart, 'b2', data) }, 200) break; case 'area':
* setTimeout(function() { drawArea(myChart, 'b2', data) }, 200) break; case
* 'dashboard': setTimeout(function() { drawDashboard(myChart, 'b2', data) },
* 200) break; case 'funnel': setTimeout(function() { drawFunnel(myChart,
* 'b2', data) }, 200) break; }; break; case 'r1': switch (type) { case
* 'bar': setTimeout(function() { drawBar(myChart, 'r1', data) }, 200)
* break; case 'star': setTimeout(function() { drawStar(myChart, 'r1', data) },
* 200) break; case 'grid': setTimeout(function() { drawGrid(myChart, 'r1',
* data) }, 200) break; case 'pie': setTimeout(function() { drawPie(myChart,
* 'r1', data) }, 200) break; case 'line': setTimeout(function() {
* drawLine(myChart, 'r1', data) }, 200) break; case 'area':
* setTimeout(function() { drawArea(myChart, 'r1', data) }, 200) break; case
* 'dashboard': setTimeout(function() { drawDashboard(myChart, 'r1', data) },
* 200) break; case 'funnel': setTimeout(function() { drawFunnel(myChart,
* 'r1', data) }, 200) break; }; break; case 'r2': switch (type) { case
* 'bar': setTimeout(function() { drawBar(myChart, 'r2', data) }, 200)
* break; case 'star': setTimeout(function() { drawStar(myChart, 'r2', data) },
* 200) break; case 'grid': setTimeout(function() { drawGrid(myChart, 'r2',
* data) }, 200) break; case 'pie': setTimeout(function() { drawPie(myChart,
* 'r2', data) }, 200) break; case 'line': setTimeout(function() {
* drawLine(myChart, 'r2', data) }, 200) break; case 'area':
* setTimeout(function() { drawArea(myChart, 'r2', data) }, 200) break; case
* 'dashboard': setTimeout(function() { drawDashboard(myChart, 'r2', data) },
* 200) break; case 'funnel': setTimeout(function() { drawFunnel(myChart,
* 'r2', data) }, 200) break; }; break; case 'r3': switch (type) { case
* 'bar': setTimeout(function() { drawBar(myChart, 'r3', data) }, 200)
* break; case 'star': setTimeout(function() { drawStar(myChart, 'r3', data) },
* 200) break; case 'grid': setTimeout(function() { drawGrid(myChart, 'r3',
* data) }, 200) break; case 'pie': setTimeout(function() { drawPie(myChart,
* 'r3', data) }, 200) break; case 'line': setTimeout(function() {
* drawLine(myChart, 'r3', data) }, 200) break; case 'area':
* setTimeout(function() { drawArea(myChart, 'r3', data) }, 200) break; case
* 'dashboard': setTimeout(function() { drawDashboard(myChart, 'r3', data) },
* 200) break; case 'funnel': setTimeout(function() { drawFunnel(myChart,
* 'r3', data) }, 200) break; }; break; };
*/