对象、类的定义与使用

对象与类是面向对象程序设计语言教学过程中不可避免需要讲解的内容之一。很多人将两者混为一谈,简单认为对象就是类,类就是对象。实际上深入分析的话,对象与类的区别还是较为明显的。本文主要介绍JavaScript中类与对象的概念区别及类的定义与使用。


Object对象与Class类

对象与类是面向对象的核心,不同教材对对象与类概念进行了不同阐述。一般理解为类的实例化结果即为对象。实际上深入分析的话,对象与类的区别还是较为明显的。归纳起来,类是对客观事物的描述与抽象,对象是类的实例。客观事物的抽象与描述是指抽取某类事物共同具有的状态与行为构成类。在程序设计语言中所抽取的状态与行为,即为类的属性(Attributes)与方法(method)。下图使用手机为例对象与类关系描述。

手机为例说明对象与类

使用手机对类与对象说明描述如上所示,其中华为、苹果、小米手机等现实世界中的物品,可直接表示为计算机中具体的对象。所有的手机对象抽取出共有的属性与方法就构成了抽象的数据类型,我们称为类。从类到对象的过程称为实例化,从对象到类可以理解为抽象与封装


ECMAScript 5(ES5)类的定义

ECMAScript标准是JavaScript程序语言所遵循的规则与标准,在ECMAScript5及之前标准下的JavaScript语言中没有提供关于类Class相关标准与要求。在该标准下只能通过模拟实现类。目前使用模拟方法构造类方法较多,本文主要介绍两种常用方法:

1、Object对象原型法

在JavaScript中基本上所有的对象都是Object对象的实例,都继承了Object对象的方法与属性。通过使用Object对象可以创建用户自定义对象,并且可以通过prototype属性进行对象属性及方法的设置。以下以手机为例进行说明。定义一个手机对象,该对象属性包括品牌名字、价格两个属性,还具有一个输出显示手机品牌价格信息的方法。通过使用对象原型法编写实现代码如下图:

对象原型法实现类示例

如上图所示,我们为Object对象添加了两个属性uname与price分别标书手机品牌与价格,添加了两个方法分别完成赋值与输出显示。完成之后对Object进行了实例化操作,huawei与iphone就是实例化之后的对象。

2、构造函数法

构造函数法相对原型方法较更加容易理解,我们将一个函数直接实例化成类的对象,以此实现对类的模拟操作。如上例所示手机类及实例化对象,我们亦可以改用构造函数法进行模拟类对象的实现。主要实现代码描述如下:

构造函数实例化模拟类对象

构造函数实例化实现对象创建实例如上图所示,使用这种方法我们也可以快速设计模拟类的实例化实现。上例中的huawei与iphone可以看成类的实例化对象。


ECMAScript 6(ES6)类定义

尽管在ES5中没有使用class实现类的定义,但是class作为关键字进行了保留。在2015年推出的ES6版本中正式将Class作为对象模板,用于实现类的定义,尽管这里的Class本质上仍然是函数。使用Class实现类的定义基本语法描述如下:

Class定义语法

class定义基本语法描述如上图所示,借助class关键字,我们可以定义类并能够设置其属性与方法。针对前文所举例手机类、属性及方法,我们可以使用class进行定义。定义与使用描述如下图:

JavaScript类的定义与使用

使用Class关键字定义类,使得JavaScript中的类更加符合面向对象程序语言要求。从属性、方法等结构方面与我们真正意义上的类更加接近。


本头条号长期关注编程资讯分享;编程课程、素材、代码分享及编程培训。如果您对以上方面有兴趣或代码错误、建议与意见,可在评论区回复。更多程序设计相关教程及实例分享,期待大家关注与阅读!JavaScript基础教程系列教程链接如下:

JavaScript基础教程(八)Array数组对象定义与访问

JavaScript基础教程(七)函数的编写与使用

JavaScript基础教程(六)流程控制之循环语句

JavaScript基础教程(五)流程控制之条件语句

javascript基础教程_JavaScript基础教程(九)对象、类的定义与使用相关推荐

  1. javascript基础入门_javascript基础入门学习第一篇

    今天主要讲述js,在讲述今天的编程知识之前,我们要对C++做一个说明因为一些原因C的知识不做更新了,下面将讲述js的编程知识,首先需要了解的是js是一个脚本语言不是编程语言这两者的区别就是一个需要依附 ...

  2. 麒麟子Javascript游戏编程零基础教程大纲

    大家好,我是麒麟子, 开源项目<幼麟棋牌-四川麻将>(泄漏版叫 <达达麻将>)作者,成都幼麟科技创始人. 开源项目地址(Github与Gitee同步更新): Github ht ...

  3. 【JavaScript系列】JS基础语法_从变量到数组一网打尽_有教程有实战

    [JavaScript系列]基础语法_从变量到数组一网打尽_有教程有实战 JavaScript基础语法目录 基础语法 延迟和异步脚本 变量 数据类型 数据类型简介 简单数据类型与复杂数据类型 栈和堆 ...

  4. JavaScript基础语法_JavaScript内置对象

    JavaScript内置对象 JavaScript中的对象分为3种:自定义对象,内置对象,浏览器对象 前两种对象是JS基础内容,属于ECMAScript;第三个浏览器对象属于js独有 内置对象就是指J ...

  5. android 编辑9图片,Android基础入门教程——1.6 .9(九妹)图片怎么玩

    Android基础入门教程--1.6 .9(九妹)图片怎么玩 Android基础入门教程 1.本节引言: 可能有的一些疑问: 1.什么是.9图片? 答:图片后缀名前有.9的图片,如pic1.9.png ...

  6. Android基础入门教程——1.6 .9(九妹)图片怎么玩

    转自:http://blog.csdn.net/coder_pig/article/details/46963687 Android基础入门教程--1.6 .9(九妹)图片怎么玩 标签(空格分隔):  ...

  7. 麒麟子Javascript游戏编程零基础教程三:无处不在的Javascript

    如果你是从大纲那一篇开始看过来的,你在点开这个文章的连接之前,肯定期望说,麒麟子又会在讲正式内容之前BB点什么,这样的话,看起教程来轻松不累还实惠.没错,你猜对了,这就是我的风格. 为什么会把编程教学 ...

  8. style 字体加粗_第9篇 Qt Quick入门教程之基础(九)文本显示和字体

    导语 文本显示是界面开发必不可少的内容,在Qt Quick模块中提供了 Text 项目来进行文本的显示,其中可以使用 font 属性组对文本字体进行设置.这一篇我们来看看它们的具体使用. 使用字体 就 ...

  9. JSP WEB开发入门基础到高手进阶教程002

    JSP WEB开发入门基础到高手进阶教程 -------开发入门 JSP与微软的Active Server Pages 兼容,但它是使用类似HTML的卷标以及Java程序代码段而不是VBScript. ...

最新文章

  1. 【bzoj2081】[Poi2010]Beads Hash
  2. JS 提交form表单
  3. JavaScript的键盘事件
  4. 【转】LDA数学八卦
  5. 如何使用rollup打包前端组件/库
  6. linux PHP卸载不了
  7. Android - 返回上一个界面finish()方法
  8. Cesium:加载json数据
  9. linux安装等宽中文字体,CentOS 5.5安装中文字体文泉驿
  10. 心不隔离|愿春早来,花枝春满
  11. 手机号批量筛选微信是什么?
  12. 实现Android手机之间在局域网下传输任意文件
  13. package.json与package-lock.json
  14. Vue中 $event not defined
  15. gii无法访问 yii2_yii2 学习历程——gii配置外部用户访问权限问题
  16. I Want to Know
  17. 分享 | 日置3561电池测试仪调零/自校准详解教程
  18. 导出Excel功能的3种实现
  19. QQmail Multiple Xss Vulnerabilities
  20. strlen()函数

热门文章

  1. 【翻译】关于vertical-align所有你需要知道的
  2. 把一张的数据添加到另一张中
  3. Universal-Image-Loader(UIL)图片载入框架使用简介
  4. [POJ2420]A Star not a Tree?(模拟退火)
  5. 使用 VS2005 编译 directshow sample 时链接错误
  6. NGINX 配置404错误页面转向
  7. curl java_如何将curl -X post转换为java
  8. python networkx库_python之networkx库小结
  9. 如何利用python在一个文档里写入长须_Python语法入门—文件处理
  10. python语言format用法_python基础_格式化输出(%用法和format用法)