Question

开始阅读javascript忍者书，我真的不明白为什么这个词＆＃39;这个＆＃39;在下面的例子中需要。我尝试了它没有它，代码不运行。这个＆＃39;这个目的是什么？服务于以下背景？我想我理解了这个＆＃39;（或者根本不是），但在下面，我只是不明白。请告诉我！谢谢。

<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
(function() {
    var results;
    this.assert = function assert(value,desc) {
        var li = document.createElement("li");
        li.className = value ? "pass" : "fail";
        li.appendChild(document.createTextNode(desc));
        results.appendChild(li);
        if ( !value ) {
            li.parentNode.parentNode.className = "fail";
        }
        return li;
    };

    //this.test = function test(name, fn) {
    this.test = function test(name, fn) {
        results = document.getElementById("results");
        results = assert(true,     name).appendChild(document.createElement("ul"));
        fn();
    };
})();

window.onload = function() {
    test("A test", function() {
        assert(true, "First assertion completed");
        assert(true, "Second assertion completed");
        assert(true, "Third assertion completed");

    });

    test("Another stupid test", function() {

        assert(true, "First assertion completed");
        assert(true, "Second assertion completed");
        assert(true, "Third assertion completed");

    });
    test("A third test", function() {
        assert(null, "fail");
        assert(5, "pass")

    });

};
</script>
<style type="text/css">
    #results li.pass { color: green;}
    #results li.fail { color: red;}

</style>
</head>
<body>
<ul id="results"</ul>
</body>
</html>

Answer 1

代码利用了以下事实：当没有任何上下文调用函数时，不在“严格”模式下的代码会将this设置为对全局上下文（window）的引用。因此，在第一个函数中，this是window，并且“test”和“assert”符号被绑定为全局变量。

就我个人而言，我认为这是用于教学目的的一段有问题的代码。我认为编写像这样的初始函数会更好（也更清晰）：

(function(global) {
    var results;
    global.assert = function assert(value,desc) {
        var li = document.createElement("li");
        li.className = value ? "pass" : "fail";
        li.appendChild(document.createTextNode(desc));
        results.appendChild(li);
        if ( !value ) {
            li.parentNode.parentNode.className = "fail";
        }
        return li;
    };

    //this.test = function test(name, fn) {
    global.test = function test(name, fn) {
        results = document.getElementById("results");
        results = assert(true,     name).appendChild(document.createElement("ul"));
        fn();
    };
})(this);

上述代码可以在“严格”模式下正常工作，并且更明确地全局绑定这些符号。

Answer 2

要更好地了解this的工作原理，请查看相关问题的答案：

How does the "this" keyword work?

这应该告诉您在JavaScript中需要了解的所有内容（以及更多内容）this。

javascript忍者书籍秘密的例子

2 个答案: