Javascript嵌套/封装原型方法

Javascript nested / encapsulated prototype method

有没有什么方法可以将对象原型方法嵌套在对象的定义中,以保持最佳的可读性?主要关注的是所涉及的内存占用和效率。

来自像 C# 这样的语言,甚至看到 PHP 具有更好的对象实现(在我看来)都是令人沮丧的。是否有任何库或其他东西允许 Class-like OOP 我习惯于 Javascript?

我想我是在寻找嵌套的封闭感,而不是在外壳之外。我也习惯了你制作 Class 的语言,它是你构建的对象的蓝图。也许我一直都错了,那些其他语言一直在复制内存中的代码,但我想它们已经过优化,使内部方法指向单个内存引用。 javascript是不是要这样啊,为什么,是不是落后了,我是不是做错了,还有其他办法吗?

我知道在编译语言中你会 类 每个都有自己的文件 - 那时我觉得没有嵌套是半合理的。这不适用于 web 范式——一切都应该在尽可能少的请求中。有没有我应该研究的东西可以将 JS 编译成一个文件?

例如

"The Wrong Way": method/function: getFullName 包含在 Person.

function Person(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;

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

"The Right Way" 使用原型制作

function Person(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
}

Person.prototype.getFullName = function() {

听起来您正在寻找 TypeScript,它几乎可以回答您所有的问题。

TypeScript is a free and open source programming language developed and maintained by Microsoft. It is a strict superset of JavaScript, and adds optional static typing and class-based object-oriented programming to the language.

http://www.typescriptlang.org/

Javascript就是javascript,C#就是C#,两者不能直接比较。 Javascript 可能很棒,我真的建议您在直接进入 TypeScript 之前多读一些书。

如果您有兴趣,这是一个很好的起点: http://shop.oreilly.com/product/9780596517748.do

这是我看到 transpilers for TypeScript and Babel for ES6 后想到的。

这是原始问题在 TypeScript 和 ES6 中的代码及其转换(这是一个真实的词吗?)

TypeScript:

class Person {
    firstName: string;
    lastName: string;
    constructor(firstName: string, lastName: string) {
        this.firstName = firstName;
        this.lastName = lastName;
    }
    getFullName() {
        return this.firstName+' '+this.lastName;
    }
}

Transpiled(最简单的结果): 我想这将是我最初问题的直接简单答案。

var Person = (function () {
    function Person(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
    }
    Person.prototype.getFullName = function () {
        return this.firstName + ' ' + this.lastName;
    };
    return Person;
})();

ES6:

class Person {
    constructor(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
    }

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

转译:

"use strict";

var _createClass = (function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; })();

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

var Person = (function () {
  function Person(firstName, lastName) {
    _classCallCheck(this, Person);

    this.firstName = firstName;
    this.lastName = lastName;
  }

  _createClass(Person, [{
    key: "getFullName",
    value: function getFullName() {
      return this.firstName + " " + this.lastName;
    }
  }]);

  return Person;
})();

转译松散模式:

"use strict";

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

var Person = (function () {
  function Person(firstName, lastName) {
    _classCallCheck(this, Person);

    this.firstName = firstName;
    this.lastName = lastName;
  }

  Person.prototype.getFullName = function getFullName() {
    return this.firstName + " " + this.lastName;
  };

  return Person;
})();

据我了解,TypeScript 是构建在 JS 之上的 "superset",其中一个明显的添加是显式类型。 ES6 及更高版本就是我们所知道的 JavaScript,它们只是尚未被完全采用并完全集成到大多数现代浏览器中。这就是为什么存在将代码从 ES6 编译到 ES5 的原因,这似乎目前已被现代浏览器完全支持。

总之...

尽管我喜欢类型化语言,但我认为它在 JS 中可能有点矫枉过正,ES6 看起来更像我以前看到的 JS(尽管与 C#[= 相比,这似乎与我最初的问题略有矛盾55=]),然后 ES6 实际上是未来的 vanilla JS ;) TypeScript 似乎可以转换成简单的 JS,而 ES6 增加了一些开销和一些健全的功能。 TS 很可能会在转译过程中处理一些检查 - 我确信适当的 IDE 也会在转译之前检查错误,而 Babel 的转译代码将允许您在转译后继续安全地编写代码。与实际项目大小相比,Babel 的开销在源代码大小方面似乎并不多。从这个小测试用例以及转译器的许多选项也很难正确判断它们。

Babel 的 ES6->ES5 松散模式没有健全性检查将与 TypeScript 的代码相同。上面的 TS Transpiled 代码将是现代浏览器支持的最小香草 javascript。

我是一个肮脏的 IDE 爱好者,很高兴看到 TypeScript 的在线 IDE 完成和 运行,而 Babel 只是一个带有一些基本帮助的荧光笔,例如现在作为自动双引号。我使用 Jetbrains 的产品,很高兴看到他们同时支持 TS 和 ES6。