0

0

JavaScript 中的面向对象编程

黄舟

黄舟

发布时间:2017-02-22 13:39:03

|

1619人浏览过

|

来源于php中文网

原创


 介绍

  javascript 是一个强大的面向对象编程语言,但是,并不像传统的编程语言,它采用一个以原型为基础的oop模型,致使它的语法让大多数开发人员看不懂。另外,javascript 也把函数作为首要的对象,这可能会给不够熟悉这门语言的开发人员造成更大的困惑。那就是我们决定放在前面作为一个简短前言进行介绍的原因,并且在 javascript 里也可以用作面向对象编程的一个参考。

  这个文档没有提供一个面向对象编程的规则预览,但有它们的接口概述。

 命名空间

  随着越来越多的第三方库,框架和web依赖的出现,JavaScript发展中的命名空间是势在必行的,我们得尽量避免在全局命名空间的对象和变量的冲突。

  不幸的是,JavaScript没有提供支持命名空间的编译,但是我们可以使用对象来得到同样结果。在JavaScript中我们有许多种模式来实现命名空间接口,但是我们覆盖嵌套的命名空间,它在该领域是最常用的模式。

  嵌套命名空间

  嵌套的命名空间模式使用对象字面量来捆绑一个特定应用的特定名字的功能。

立即学习Java免费学习笔记(深入)”;

  我们最初创建一个全局对象,并且赋值给一个称为MyApp的变量。

  上述的语法会检查MyApp是否已经被定义过。假如它已经被定义过,我们简单地把它赋值给自己,但是,我们创建一个空的容器来装载我们的函数和变量。

  我们也可以使用相同技术来创建子命名空间。例如:

  我们一旦启动我们的容器,我们可以在(容器)内部定义我们的函数和变量,并且在全局命名空间调用它们,不需要冒着与现有定义冲突的风险。

  在JavaScript命名模式的一个内部概述是由Goggle的Addy Osmani在Essential JavaScript Namespacing Patterns的文章中介绍的。假如你想探索不同的模式,这里将是一个美好的起点。

 对象

  如果你写过 JavaScript 代码,那你已经使用过对象了。JavaScript 有三种类型的对象:

  原生对象

  原生对象是语言规范的一部分,不管在什么样的运行环境下运行,原生对象都可用。原生对象包括:Array、Date、Math 和 parseInt 等。想了解所有原生对象,请参阅 JavaScript 内建对象参考

  宿主对象

  与原生对象不同,宿主对象是由 JavaScript 代码运行的环境创建。不同的环境环境创建有不同的宿主对象。这些宿主对象在多数情况下都允许我们与之交互。如果我们写的是在浏览器(这是其中一种运行环境)上运行的代码,会有 window、document、location 和 history 等宿主对象。

  用户对象

  用户对象(或植入对象)是在我们的代码中定义的对象,在运行的过程中创建。JavaScript 中有两种方式创建自己的对象,下面详述。

 对象字面量

  在前面演示创建命名空间的时候,我们已经接触到了对象字面量。现在来搞清楚对象字面量的定义:对象字面量是置于一对花括号中的,由逗号分隔的名-值对列表。对象字面量可拥有变量(属性)和函数(方法)。像 JavaScript 中的其它对象一样,它也可以作为函数的参数,或者返回值。

  现在定义一个对象字面量并赋予一个变量:

  向这个对象字面量添加属性和方法,然后在全局作用域访问:

  这看起来和前面的命名空间很像,但这并不是巧合。字面量对象最典型的用法就是把代码封装起来,使之在一个封装的包中,以避免与全局作用域中的变量或对象发生冲突。由于类似的原因,它也常常用于向插件或对象传递配置参数。

  如果你熟悉设计模式的话,对象字面量在某种程度上来说就是单例,就是那种只有一个实例的模式。对象字面量先天不具备实例化和继承的能力,我们接下来还得了解 JavaScript 中另一种创建自定义对象的方法。

点创DOidea网上书店
点创DOidea网上书店

一套专业的网上书店程序,可以作为新华书店及大中型书店网上销售的首选,满足在线支付及汇款确认机制。功能简介:图书分类、查询、排行、最新、特价、关注排行、销售排行,新闻系统、汇款确认机制、求购书籍、在线咨询、热门图书定义、全站广告后台管理、后台采用WEBEDIT编辑器、集成"支付宝"在线支付等...v3.5版特殊功能说明(前台):1.自带5种风格主题。2.友好的页面提示(对网站全部

下载

 构造函数

  定义构造函数

  函数是 JavaScript 一等公民,就是说其它实体支持的操作函数都支持。在 JavaScript 的世界,函数可以在运行时进行动态构造,可以作为参数,也可以作为其它函数的返回值,也可被赋予变量。而且,函数也可以拥有自己的属性和方法。JavaScript 中函数的特性使之成为可以实体化和继承的东西。

  来看看怎么用构造函数创建一个自定义的对象:

  创建构造函数类似于创建普通函数,只有一点例外:用 this 关键字定义自发性和方法。一旦函数被创建,就可以用 new 关键字来生成实例并赋予变量。每次使用 new 关键字,this 都指向一个新的实例。

  构建函数实例化和传统面向对象编程语言中的通过类实例化并非完全不同,但是,这里存在一个可能不易被察觉的问题。

  当使用 new 关键字创建新对象的时候,函数块会被反复执行,这使得每次运行都会产生新的匿名函数来定义方法。这就像创建新的对象一样,会导致程序消耗更多内存。这个问题在现代浏览器上运行的程序中并不显眼。但随着应用规则地扩大,在旧一点的浏览器、计算机或者低电耗设备中就会出现性能问题。不过不用担心,有更好的办法将方法附加给构造函数(是不会污染全局环境的哦)。

  方法和原型

  前面介绍中提到 JavaScript 是一种基于原型的编程语言。在 JavaScript 中,可以把原型当作对象模板一样来使用。原型能避免在实例化对象时创建多余的匿名函数和变量。

  在 JavaScript 中,prototype 是一个非常特别的属性,可以让我们为对象添加新的属性和方法。现在用原型重写上面的示例看看:

  这个示例中,不再为每个 Person 实例定义 sayHey 方法,而是通过原型模板在各实例中共享这个方法。

 继承性

  通过原型链,原型可以用来实例继承。JavaScript 的每一个对象都有原型,而原型是另外一个对象,也有它自己的原型,周而复始...直到某个原型对象的原型是 null——原型链到此为止。

  在访问一个方法或属性的时候,JavaScript 首先检查它们是否在对象中定义,如果不,则检查是否定义在原型中。如果在原型中也没找到,则会延着原型链一直找下去,直到找到,或者到达原型链的终端。

  现在来看看代码是怎么实现的。可以从上一个示例中的 Person 对象开始,另外再创建一个叫 Employee 的对象。

  现在 Employee 只有一个属性。不过既然员工也属于人,我们希望它能从 Person 继承其它属性。要达到这个目的,我们可以在 Employee 对象中调用 Person 的构造函数,并配置原型链。

  要适应原型继承还需要一些时间,但是这一个必须熟悉的重要概念。虽然原型继承模型常常被认为是 JavaScript 的弱点,但实际上它比传统模型更强大。比如说,在掌握了原型模型之后创建传统模型简直就太容易了。

  ECMAScript 6 引入了一组新的关键字用于实现 类。虽然新的设计看起来与传统基于类的开发语言非常接近,但它们并不相同。JavaScript 仍然基于原型。

 结论

  JavaScript已经经过了长时间的发展,在此期间,按今天的标准来看,一些本不应该使用的方法,却被大量开发者使用着。根据 ES2015 的介绍,这种状况正开始慢慢改变,然而,许多开发人员仍然坚持使用一些旧的编程方式,这损害了他们的代码的关联性。理解面向对象编程方法,并将它应用在你的JavaScript项目中,对于编写可持续的代码非常有意义。

  我希望这个简短的介绍将有助于你达到这个目标。

以上就是JavaScript 中的面向对象编程的内容,更多相关内容请关注PHP中文网(www.php.cn)!

相关专题

更多
javascript void运算符
javascript void运算符

void是一元运算符,执行右侧表达式但始终返回undefined;用于丢弃返回值、阻止a标签跳转、IIFE忽略结果、动态导入不取Promise、安全获取undefined。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1

2025.12.29

vscode的界面字体大小调整
vscode的界面字体大小调整

调整VSCode界面字体大小可通过设置编辑器或整体UI缩放实现;2.修改"Editor:FontSize"改变代码字体;3.设置"Window:ZoomLevel"调整整体界面字体;4.使用Ctrl+滚轮快捷键临时缩放。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1

2025.12.29

VSCode的注释快捷键
VSCode的注释快捷键

单行注释快捷键为Ctrl+/(Windows/Linux)或Cmd+/(macOS),块注释使用Shift+Alt+A(Windows/Linux)或Shift+Option+A(macOS),VSCode会根据语言类型自动匹配语法,如JavaScript用//,Python用#,C++用//,若快捷键无效需检查语言扩展或插件冲突。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1

2025.12.29

Golang 命令行工具(CLI)开发实战
Golang 命令行工具(CLI)开发实战

本专题系统讲解 Golang 在命令行工具(CLI)开发中的实战应用,内容涵盖参数解析、子命令设计、配置文件读取、日志输出、错误处理、跨平台编译以及常用CLI库(如 Cobra、Viper)的使用方法。通过完整案例,帮助学习者掌握 使用 Go 构建专业级命令行工具与开发辅助程序的能力。

4

2025.12.29

ip地址修改教程大全
ip地址修改教程大全

本专题整合了ip地址修改教程大全,阅读下面的文章自行寻找合适的解决教程。

165

2025.12.26

压缩文件加密教程汇总
压缩文件加密教程汇总

本专题整合了压缩文件加密教程,阅读专题下面的文章了解更多详细教程。

56

2025.12.26

wifi无ip分配
wifi无ip分配

本专题整合了wifi无ip分配相关教程,阅读专题下面的文章了解更多详细教程。

108

2025.12.26

漫蛙漫画入口网址
漫蛙漫画入口网址

本专题整合了漫蛙入口网址大全,阅读下面的文章领取更多入口。

356

2025.12.26

b站看视频入口合集
b站看视频入口合集

本专题整合了b站哔哩哔哩相关入口合集,阅读下面的文章查看更多入口。

703

2025.12.26

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
React 教程
React 教程

共58课时 | 3万人学习

TypeScript 教程
TypeScript 教程

共19课时 | 1.8万人学习

Bootstrap 5教程
Bootstrap 5教程

共46课时 | 2.7万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号