菜鸟教程个人学习心得06_JavaScript的void与回调函数

JavaScript的void

在JavaScript我们经常使用到javascript:void(0),该操作符指定要计算一个表达式但是不返回值：
示例代码：创建一个超链接，但是点击后不发生任何事情：

    <a href="javascript:void(0)">点击这里</a>

运行截图：点击超链接后并不会发生什么：

示例代码：点击超链接，弹出警告框：

    <!-- 创建一个超链接，点击后弹出警告框 -->
    <a href="javascript:void(alert('警告!!!'))">点击弹出警告</a>

运行截图：

示例代码：利用void为变量赋值，变量的值未定义：

    <p id="p1"></p>
    <script>
        var a = void (b = 2, c = 3)
        document.getElementById("p1").innerHTML = "a=" + a + ",b=" + b + ",c=" + c;
    </script>

运行结果：

href="#"与href="javascript:void(0)"的区别：
href="#"可以理解成锚点，代表了一个位置信息，当不设置时，#相当于#top，也就是网页的最顶部，也可以将其设置成其他地方，点击跳转，如：
示例代码：

    <a href="#p3">点击跳转到锚点位置</a>
    <p id="p2"></p>
    <script>
        for (i = 0; i < 100; i++) {
            document.getElementById("p2").innerHTML += "<br>"
        }
    </script>
    <p id="p3">锚点位置</p>

当点击超链接时，跳转到对应的锚点位置，在这里设置成100行空格占位，点击时比较明显。
而javascript:void(0)代表的时一个死链接，点击不会跳转到任何地方。

回调函数

回调函数用于产生子线程，简单的说就是为函数定时，设置多长事件后做什么事，执行什么函数：
示例代码：

    <p id="p4"></p>
    <script>
        function showTime(){
            document.getElementById("p4").innerHTML = Date()
        }
        setTimeout(showTime,4000)
    </script>

运行截图：

四秒后执行显示事件函数：

setTimeout在子线程等待四秒，当其执行完成之后，主线程接着执行。