JS学习（三）-函数

最新推荐文章于 2020-07-15 16:00:28 发布

在下平兄

最新推荐文章于 2020-07-15 16:00:28 发布

阅读量81

点赞数 1

分类专栏： JS

本文链接：https://blog.csdn.net/weixin_44494778/article/details/99688526

版权

本文深入探讨JavaScript中的函数，包括变量与函数的预解析、匿名函数的重点应用——实现可控的事件执行，以及封闭函数的概念和优势。通过实例解析函数定义、执行、参数传递和return关键字的作用，特别强调了匿名函数在网页换肤等场景中的使用，以及封闭函数如何创建独立作用域避免命名冲突。

摘要由CSDN通过智能技术生成

目的：实现可控制的事件执行一般用匿名函数实现

变量与函数预解析

JavaScript解析过程分为两个阶段，先是编译阶段，然后执行阶段，在编译阶段会将function定义的函数【声明和定义】提前，并且将var定义的变量【声明】提前，将它赋值为undefined。

<script type="text/javascript">    
    fnAlert();       // 弹出 hello！
    alert(iNum);  // 弹出 undefined
    function fnAlert(){
   
        alert('hello!');
    }
    var iNum = 123;
</script>

函数定义与执行

<script type="text/javascript">
    // 函数定义
    function fnAlert(){
   
        alert('hello!');
    }
    // 函数执行
    fnAlert();
</script>

行间事件

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

    // 函数的定义
    function fnChange() {
   
        var oBox = document.getElementById("box");
        oBox.style.color = "green";
        oBox.style.fontSize = "30px";
    }
    // 函数执行
    // fnChang();  直接执行没意义 而且这样也会报错 应该控制性的执行
</script>
<body>
    <!-- 标签内调用 这是一个行间事件 通过点击控制执行-->
    <div id="box">一个盒子</div>
    <div onclick="fnChange()">点击变化</div>
<

最低0.47元/天解锁文章

在下平兄

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS学习（三）-函数

函数定义与执行<script type="text/javascript"> // 函数定义 function fnAlert(){ alert('hello!'); } // 函数执行 fnAlert();</script>行间事件<!DOCTYPE html><html lang="e...
复制链接

扫一扫

专栏目录