对Javascript层次结构行为感到困惑(给出示例代码)

时间:2013-10-09 20:33:57

标签: javascript

我仍然是Javascript的新手,并且一直试图围绕特定库如何管理这些干净的类型和命名约定。

有问题的图书馆是 Telerik的 Kendo UI ,特别是我很好奇他们是如何实现让我想起C#名称空间的东西。例如......有一种名为 ObservableArray 的类型,可以通过 kendo.ui.ObservableArray 访问。

我挖掘了源代码,我对发生的事情感到很困惑。由于专有原因,我省略了很多代码,但一般的封闭应该不是问题。我想知道是否有人能帮我理解他们是如何实现这一目标的......

(function ($, evil, undefined) {
    var kendo = window.kendo = window.kendo || { cultures: {} },
        extend = $.extend,
        each = $.each; // more code omitted

    function Class() { }

    Class.extend = function (proto) {
        // most of this code omitted
        return subclass;
    };
    // more code omitted
})(jQuery, eval); // this line is really confusing me

特别是,让我失去信仰的是第二行。他们声明变量( kendo )等于 window 上定义的变量的位置。我已经搜索了几个小时和几个小时的高低不能在我的生活中找出这是第一次发生的地方。我无法在自己的代码中重现相同的行为。

我已经发现 extend 函数用作将对象与现有对象配对的方法,并选择性地将其作为可访问成员附加。但那个 window.kendo 的事情,让我发疯了。

2 个答案:

答案 0 :(得分:2)

这并不复杂。拿这个,例如:

var a, b, c;
a = b = c = 100;

括号可能会有所帮助:

a = (b = (c = 100));

c = 100实际上是一个表达式。它会将100分配给c,然后评估为100。所以进展到:

a = (b = 100);

然后它将100分配给b并进一步简化:

a = 100

最后还将100分配给a


所以当你有以下内容时:

var kendo = window.kendo = window.kendo || { cultures: {} }

首先,它将window.kendo || {cultures: {} }的结果分配给window.kendo。然后它将相同的结果分配给局部变量kendo


最后一招是window.kendo || {cultures: {} }完全正确的做法。如果a || b为真,则a评估为a;如果b为假,则a评估为10 || 20; //evaluates to 10 undefined || 20; //evaluates to 20 undefined || null; //evaluates to null

window.kendo

因此,如果尚未定义window.kendo || {cultures: {} }{cultures: {} }评估为window.kendo。否则,它已经评估为> function logit(s, label) { label = label || "nolabel"; console.log(label + ": " + s); } > logit("Hey there") nolabel: Hey there > logit("Hey there", "Fooman") Fooman: Hey there

这是指定默认值的一种很好的方法,例如:

{{1}}

答案 1 :(得分:0)

window.kendo是一种获取名为kendo的全局变量的方法。

kendo = window.kendo = window.kendo || { cultures: {} }

这会将本地kendo和全局kendo的值设置为全局值(如果存在),或者如果全局不存在则将其设置为等于object literal。