繁体   English   中英

全局范围的函数表达式

[英]Function expressions on global scope

在发现了TypeScript之后,我使用了在线编译器,并且生成的JavaScript代码让我对函数表达式感到疑惑。

一个简单的TypeScript类:

class Person {
    firstName: String = "John";
    lastName: String = "Doe";
}

结果在以下JavaScript代码中:

var Person = (function () {
    function Person() {
        this.firstName = "John";
        this.lastName = "Doe";
    }
    return Person;
})();

这让我想知道为什么他们选择使用自动执行功能,当更简单的东西可能已经足够时。 内部函数的名称与变量名称相同的目的是什么?
为什么他们没有更简单的东西,例如:

var Person = function() {
    this.firstName = "John";
    this.lastName = "Doe";
};

甚至:

function Person() {
    this.firstName = "John";
    this.lastName = "Doe";
}


据我所知,在全局范围内使用函数表达式没有任何优点,只有在声明函数之前无法调用函数的缺点。

它有助于继承。 它允许它们通过重命名为_super捕获基类,这有助于代码生成,例如:

class Foo{

}

class Bar extends Foo{

}

成为:

var __extends = this.__extends || function (d, b) {
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
    function __() { this.constructor = d; }
    __.prototype = b.prototype;
    d.prototype = new __();
};
var Foo = (function () {
    function Foo() {
    }
    return Foo;
})();

var Bar = (function (_super) {
    __extends(Bar, _super);
    function Bar() {
        _super.apply(this, arguments);
    }
    return Bar;
})(Foo); // Notice base class is captured here

这也是JS的好习惯。 例如,如果您在此示例中继续使用Foo而不是_super并且您要更改基类,则可能会有一个令人头疼的问题,这是可以避免的。

你真的不希望能够在声明执行之前调用一个类。 考虑以下代码:

class Person {
    static nameSeparator = ' ';

    public fullName: string;

    constructor(public firstName, public lastName) {
        this.fullName = firstName + Person.nameSeparator + lastName;
    }
}

它的生成形式:

var Person = (function () {
    function Person(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
        this.fullName = firstName + Person.nameSeparator + lastName;
    }
    Person.nameSeparator = ' '; // <-- Important!
    return Person;
})();

您是否希望在指定的行之前意外运行的代码以未定义的行为运行(在这种情况下,Person.fullName是“JohnundefinedSmith”),或者只是失败?

在其他情况下,该课程根本不起作用:

class Person {
    constructor(public firstName, public lastName) {
        // Will fail until Person.prototype.getFullName gets set
        console.log('New person, name = ' + this.getFullName());
    }

    getFullName() {
        return this.firstName + " " + this.lastName;
    }
}

这允许您创建一些私有变量。

在JS中:

var Person = (function () {
    var firstName, lastName; //static private vars
    function Person(fName, lName) {
        firstName = fName;
        lastName = lName;
    }
    return Person;
})();

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM