1. 程式人生 > >JavaScript Function,建立函式物件(new Function()),字串當代碼來執行

JavaScript Function,建立函式物件(new Function()),字串當代碼來執行

demo.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>

        function Person(name, age){
            this.name = name;
            this.age = age;
        }

        var p = new Person("張三",19);


//        var func = new Function("console.log('我是動態建立的函式');console.log(1);");  
//        func();    // 會把Function() 中最後一個引數當做函式體執行。
        // 類似 eval()函式,可以將字串當做程式碼(函式體)來執行。


        //Function這個建構函式 可以用來建立函式物件
        //語法:
        //0.一個引數都不傳的情況  建立的就是一個空的函式
        //var 函式名 = new Function()
        //1.只傳一個引數的情況 這個引數就是函式體
        //var 函式名 = new Function("函式體")
        //2.傳多個引數的情況,最後一個引數為函式體,前面的引數都是該函式的形參名

        //練習:使用Function建立一個列印4句歌詞的函式
//        var func = new Function("console.log('4句歌詞');");
//        func();

        //舉個栗子
        //建立一個計算兩個數的和的函式
//        var sum = new Function("a", "b", "return a + b;");
//        console.log(sum(1, 1111));
        

        window.onload =function () {
            var script = document.getElementById("funcContent");
            var str = script.innerHTML;
            var max = new Function("arr", str);  // 最後一個引數當函式體來執行,前面的引數當成函式體的引數。
            console.log(max([1, 2, 3, 44, 5, 6]));
        }



        //如何解決使用Funciton建立函式時,程式碼過長的問題
        //1.可以使用"+"號拼接字串 讓程式碼換行
        //2.使用模板的方式,將程式碼寫在模板標籤內,獲取該標籤的內容
        //3.使用反引號(`) 引住字串,那麼就可以 換行了
        var str = `adfafdsa
                asdfas`;
        console.log(str);

    </script>
<script type="text/template" id="funcContent">
    var maxNum = arr[0];
    for(var i = 1; i<arr.length; i++){
        if(maxNum < arr[i]){
            maxNum = arr[i];
        }
    }
    return maxNum;
</script>
</head>
<body>

</body>
</html>