JavaScript 基于原型的继承的好例子

2024-01-27

我使用 OOP 语言进行编程已经有 10 多年了,但我现在正在学习 JavaScript,这是我第一次遇到基于原型的继承。我倾向于通过研究好的代码来学得最快。正确使用原型继承的 JavaScript 应用程序(或库)的编写良好的示例是什么?您能否(简要地)描述如何/在何处使用原型继承,以便我知道从哪里开始阅读?


如前所述,道格拉斯·克罗克福德 (Douglas Crockford) 的电影很好地解释了原因和方法。但将其放入几行 JavaScript 中:

// Declaring our Animal object
var Animal = function () {

    this.name = 'unknown';

    this.getName = function () {
        return this.name;
    }

    return this;
};

// Declaring our Dog object
var Dog = function () {

    // A private variable here        
    var private = 42;

    // overriding the name
    this.name = "Bello";

    // Implementing ".bark()"
    this.bark = function () {
        return 'MEOW';
    }  

    return this;
};


// Dog extends animal
Dog.prototype = new Animal();

// -- Done declaring --

// Creating an instance of Dog.
var dog = new Dog();

// Proving our case
console.log(
    "Is dog an instance of Dog? ", dog instanceof Dog, "\n",
    "Is dog an instance of Animal? ", dog instanceof Animal, "\n",
    dog.bark() +"\n", // Should be: "MEOW"
    dog.getName() +"\n", // Should be: "Bello"
    dog.private +"\n" // Should be: 'undefined'
);

然而,这种方法的问题在于,每次创建对象时都会重新创建该对象。另一种方法是在原型堆栈上声明对象,如下所示:

// Defining test one, prototypal
var testOne = function () {};
testOne.prototype = (function () {
    var me = {}, privateVariable = 42;
    me.someMethod = function () {
        return privateVariable;
    };

    me.publicVariable = "foo bar";
    me.anotherMethod = function () {
        return this.publicVariable;
    };

    return me;

}());


// Defining test two, function
var testTwo = ​function() {
    var me = {}, privateVariable = 42;
    me.someMethod = function () {
        return privateVariable;
    };

    me.publicVariable = "foo bar";
    me.anotherMethod = function () {
        return this.publicVariable;
    };

    return me;
};


// Proving that both techniques are functionally identical
var resultTestOne = new testOne(),
    resultTestTwo = new testTwo();

console.log(
    resultTestOne.someMethod(), // Should print 42
    resultTestOne.publicVariable // Should print "foo bar"
);

console.log(
    resultTestTwo.someMethod(), // Should print 42
    resultTestTwo.publicVariable // Should print "foo bar"
);



// Performance benchmark start
var stop, start, loopCount = 1000000;

// Running testOne
start = (new Date()).getTime(); 
for (var i = loopCount; i>0; i--) {
    new testOne();
}
stop = (new Date()).getTime();

console.log('Test one took: '+ Math.round(((stop/1000) - (start/1000))*1000) +' milliseconds');



// Running testTwo
start = (new Date()).getTime(); 
for (var i = loopCount; i>0; i--) {
    new testTwo();
}
stop = (new Date()).getTime();

console.log('Test two took: '+ Math.round(((stop/1000) - (start/1000))*1000) +' milliseconds');

内省时有一个轻微的缺点。转储 testOne 将导致有用信息减少。此外,“testOne”中的私有属性“privateVariable”在所有实例中共享,shesek 的回复中也提到了这一点。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

JavaScript 基于原型的继承的好例子 的相关文章

随机推荐

  • HTTP 缓存控制 max-age,必须重新验证

    我有几个与缓存控制相关的疑问 如果我指定缓存控制max age 3600 must revalidate对于静态 html js images css 文件 在 HTTP 标头中定义了 Last Modified 标头 浏览器 代理缓存 如
  • 从 Windows 服务启动 Windows 应用程序

    我正在尝试使用以下代码从 Windows 服务启动 Windows 应用程序 Process Start filename exe 在 Windows 7 中 我收到一个弹出窗口 显示 此计算机上运行的程序正在尝试显示一条消息 您无法从 W
  • Python subprocess.popen() 无需等待

    我在 Windows 上使用 Python 3 4 2 在 script1 py 中我正在这样做 myProc subprocess Popen sys executable script2 py argument myProc commu
  • iPhone 上奇怪的应用程序崩溃 - 没有被 Apple 拒绝

    我最近通过 iTunes Connect 向 Apple 提交了我的应用程序 它现在已在 iTunes 商店中 然而 当我把它下载到朋友的 iPhone 上时 它立即崩溃了 我在 iPhone 模拟器和 iPad 上进行了测试 我没有 iP
  • 可编辑数据表 RowKey Null

    我有一个可编辑的 Primefaces 数据表 配置为在编辑单元格时调用 onCellEdit 方法 一切工作都很好 除了 CellEditEvent rowKey 始终为 null 尽管在数据表声明中使用 rowKey 将其显式设置为有效
  • 在 Windows 上,如何检测文件的行结尾?

    我已经看到了这些问题的答案 但据我所知 这些答案并不是从 Windows 角度来看的 Windows 使用 CR LF Unix 使用 LF Mac 使用 LF 经典 mac 使用其他内容 我没有足够的智慧来告诉我 如果一个文件使用的行尾与
  • 如何使浏览器后退按钮忽略主题标签?

    我有一个网站 它使用哈希来打开 关闭当前页面上的一些选项卡和图层 使用哈希值的原因是 如果用户通过链接访问另一个页面 然后返回原始页面 则所有选项卡和图层的打开方式都应与离开该页面时完全相同 问题是 在第一页上并使用浏览器后退按钮时 只有哈
  • Bower:ENOGIT Git 未安装或不在 PATH 中

    Git 已安装并位于路径中 平台 红帽企业 Linux en wikipedia org wiki Red Hat Enterprise Linux 5 8 gt which git usr local bin git 然而 Bower 找
  • 基于窗口调整大小的 jQuery 位置元素

    如果您查看此页面 http dev driz co uk tips http dev driz co uk tips 我正在做一些实验来更多地了解 jQuery 以及如何开发类似于我们在 Facebook 上看到的东西 您将看到我有一个相对
  • Tensorflow.compat.v2.__internal__.tracking'没有属性'TrackableSaver'错误

    安装 Tensorflow js 后出现此错误 以前这个程序是有效的 会不会是版本的问题 我真的很好奇是什么原因造成的 提前致谢 File OneDrive Masa st Bitirme Proje neural network sini
  • Android - Google Map API v2 - 不幸的是,应用程序已停止。每次强制关闭

    大家好 我在这里找到了关于使用 Google Map API 时强制关闭 Android 中的应用程序的类似主题 我几乎尝试了所有方法 一步一步按照教程进行操作并检查了两次以上 每次出现问题并且我的应用程序都会立即崩溃 我什至无法运行 Go
  • Bootstrap-select插件:如何避免闪烁

    Bootstrap select 插件非常棒 http silviomoreto github io bootstrap select http silviomoreto github io bootstrap select 它提供了一种在
  • Ruby on Rails、Paperclip、Heroku、GitHub 和 AWS - 保护密钥

    我正在使用 Heroku 托管的 RoR 我想使用回形针将文件存储在 s3 上 我的源代码托管在 github 上 全世界都可读 对世界其他地方保密密钥的最佳做法是什么 Paperclip 建议将访问密钥存储在配置文件 或代码 中 例如我有
  • 使用单链表,如何在python中交换节点?

    目前 我一直在尝试根据我的主功能开关 myList index 重新排列链表 def createList plist linkedList None goes backwards adding each element to the be
  • 使用 XPath 提取标签之间的文本(包括标记)

    我有以下 XML 片段 span class st In Tim em Power em Politieman span 我想提取之间的部分 span 标签 为此 我使用 XPath span class st 然而 这将提取所有内容 包括
  • 设置 ContentPresenter 中自动生成的文本块的样式

    正如我所看到的 很多人都遇到了这个问题 但我不明白为什么我的案例不起作用 它开始让我发疯 背景 我有一个DataGrid将根据每个单元格的值着色 因此 我有一个动态样式来解析每个单元格使用的实际模板 背景现在可以相应地工作 新问题 当我有深
  • 在会话状态中存储购物车的数据

    尝试将我存储的内容添加到购物车中以进入会话 然后将其转移到另一个页面以获取 GridView 以显示我已添加到购物车会话中的所有项目 将其存储为对象会话 AddToCart 获取该行详细信息并存储在会话中 然后获取该会话对象并将其显示在另一
  • HTML5 CANVAS:如何从服务器保存和重新打开图像

    我用 html5 canvas 画一些东西 然后我想保存它 当再次加载页面时 我想将我保存的图像加载回画布 我成功地将数据保存到服务器中的文件中 但由于某种原因 这是一个奇怪的文件 无法通过ant软件打开 当然也不能通过我的画布打开 我将其
  • 使用 f#/fable/asp.net/react 添加 google 登录按钮

    我正在使用 SAFE 堆栈 https safe stack github io https safe stack github io 并通过示例 dojo 到目前为止非常棒 我想扩展该示例以包含一个通过 Google 登录 身份验证的按钮
  • JavaScript 基于原型的继承的好例子

    我使用 OOP 语言进行编程已经有 10 多年了 但我现在正在学习 JavaScript 这是我第一次遇到基于原型的继承 我倾向于通过研究好的代码来学得最快 正确使用原型继承的 JavaScript 应用程序 或库 的编写良好的示例是什么