JavaScript 函数

最新推荐文章于 2022-08-12 23:11:48 发布

clvsit

最新推荐文章于 2022-08-12 23:11:48 发布

阅读量122

点赞数

分类专栏： JavaScript 文章标签： JavaScript 函数

本文链接：https://blog.csdn.net/weixin_43378396/article/details/85841857

版权

JavaScript 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

函数

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

背景：

特点：

第一类对象（first-class object），可以作为带有属性和方法的值以及参数进行传递。
提供局部作用域。

函数就是对象的表现：

函数可以在运行时动态创建，还可以在程序执行过程中创建。

<!-- 在该例子中创建了一个即时函数 -->
<body>
<button id="button">创建一个 alert 函数</button>
<script>
    window.onload = function() {
        var button = document.getElementById("button");
        button.addEventListener("click", function() {
            (function() {
                alert("Hello World!");
            }())
        }, false)
    }
</script>
</body>
<!-- 创建一个 alert 自定义值的函数 -->
<body>
<input type="text" placeholder="请输入 alert 要输出的语句" id="input" />
<button id="button">创建一个自定义 alert 函数</button>
<script>
    window.onload = function() {
        var button = document.getElementById("button"),
            input = document.getElementById("input"),
            func = null,
            node = document.createElement("button");
        button.addEventListener("click", function() {
            // 创建新的函数
            func = function() {
                alert(input.value);
            };
            // 创建节点，并为该节点绑定点击事件
            node.addEventListener("click", func, false);
            node.innerText = "我是动态创建的函数";
            document.body.appendChild(node);
        }, false)
    }
</script>
</body>

函数可以分配给变量，可以将它们的引用复制到其他变量，可以被扩展，此外，除少数特殊情况外，函数还可以被删除。

function func() {
    alert("Hello World!");
}
var func_variable = func;
func_variable();
func();

可以作为参数传递给其他函数，并且还可以由其他函数返回。

// 在该例子中，sayHello 函数作为参数传递给 handle 函数。
function sayHello() {
    alert("Hello World!");
}
function handle(func) {
    func();
}
handle(sayHello);
// 在该例子中，returnFunc 函数返回一个匿名函数。
function returnFunc() {
    return function() {
        alert("Hello World!");
    }
}
var func = returnFunc();
func();

函数可以有自己的属性和方法。

var Dog = function() {
    name : '旺财',          // 属性
    bark : function() {     // 方法
        alert("汪汪汪！");
    }
}

提供作用域：

JavaScript 中没有花括号 {} 语法以定义局部作用域。也就是说，块并不创建作用域。因此，如果在 if 条件语句或在 for 以及 while 循环中，使用 var 关键词定义变量，并不意味该变量对于 if 或 for 来说是局部变量，它仅仅对于包装函数来说是局部变量。如果没有包装函数，它将会成为一个全局变量。
JavaScript 仅存在函数作用域和全局作用域。在函数内部以 var 关键词定义的任何变量都是局部变量，对于函数外部不可见。

类别

函数声明：
函数表达式：
命名函数表达式：

/* 函数声明 */
function func() {
    // 函数体
}
/* 函数表达式：未命名函数表达式-匿名函数 */
var func = function() {
    // 函数体
}
document.addEventListener("click", function() {
    // 函数体
}, false)
/* 命名函数表达式 */
var func = function func() {
    // 函数体
}

差别：

函数声明：

函数声明不需要分号结尾。
函数表达式中需要分号结尾。

函数声明与函数表达式

关于函数的一些小问题

var arr = [1, 2, 3];

function func(arr) {
    arr[0] = 10;
}
func(arr);

console.log(arr);

在 JS 中如果传入函数的参数是引用，那么传给函数的是实参的引用地址。因此上述 console.log() 输出 [10, 2, 3]。

var arr = [1, 2, 3];

function func(arr) {
    arr = [10, 20, 30];
}
func(arr);

console.log(arr);

上述 console.log() 输出 [1, 2, 3]，为什么会这样？
传给函数的 arr 参数的值实际上是 [1, 2, 3] 的地址，arr = [10, 20, 30] 语句将 arr 参数的值修改为 [10, 20, 30] 的地址。当函数执行结束后，就会将 arr 变量消除，此时要明确一点 [1, 2, 3] 并没有发生变化，因为你只在函数中修改 arr 变量的值，而非 [1, 2, 3] 的值。因此最后输出的内容自然还是 [1, 2, 3]。

clvsit

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript 函数

函数函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。背景：特点：第一类对象（first-class object），可以作为带有属性和方法的值以及参数进行传递。提供局部作用域。函数就是对象的表现：函数可以在运行时动态创建，还可以在程序执行过程中创建。&lt;!-- 在该例子中创建了一个即时函数 --&gt;&lt;body&gt;&lt;button i...
复制链接

扫一扫