01创建函数的几种方式

创建函数的几种方式

01 函数声明
02 函数表达式
03 new Function()

<script>
    // 01函数声明
    function func(){
        // 函数体
    }

   //function funName(参数1,参数2){函数体}   //函数声明

    // 02函数表达式
    var func01 = function(){};       //匿名函数表达式
    var func02 = function name(){};  //命名函数表达式

    // 03 new Function
    var foo = new Function("console.log(\"1\")");
    foo();
</script>

new Function创建函数使用注意点

01一个参数都没有，那么创建的是一个空函数
02有一个参数，这个参数作为新创建出来的函数的函数体
03有多个参数，最后一个参数是新创建的函数的函数体，其它的参数是形参列表

demo01 new Function传入三个参数

<script>
    var foo = new Function("a", "b", "console.log(a + b)");
    foo(1,1);
</script>

demo02 需求：new Function创建函数对象，该函数打印几句歌词

• '+' 操作符拼接字符串
• 反括号``
• 使用js模板来存放数据

<script type="text/template" id="demo">
    console.log("让我掉下眼泪的，不是昨夜的酒");
    console.log("让我依依不舍的，不止你的温柔");
    console.log("余路还要走多久，我牵着你的手");
</script>

<script>
    // 01 使用``
    var foo1 = new Function(`
        console.log("让我掉下眼泪的，不是昨夜的酒");
        console.log("让我依依不舍的，不止你的温柔");
        console.log("余路还要走多久，我牵着你的手");
    `);
    foo1();

    // 02 使用 + 连字符
    var foo2 = new Function("console.log(\"让我掉下眼泪的，不是昨夜的酒\");" +
                            "console.log(\"让我依依不舍的，不止你的温柔\");" +
                            "console.log(\"余路还要走多久，我牵着你的手\");");
    foo2();

    // 03 使用js中script模板
    var script = document.getElementById("demo");
    var str = script.innerHTML;
    var func = new Function(str);
    func();

</script>