理解JavaScript中的对象


Posted in Javascript onAugust 25, 2020

JavaScript中对象的简介

我们知道生活中客观存在的一切事物皆为对象,那在程序中的对象是什么样子呢?我们可以将程序中的对象理解为客户端世界中的对象在一种计算机中的一种表示方式.所有的编程语言中提到的对象其性质都是类似的,它往往对应内存中的一块区域,在这个区域中存储对象的属性或方法信息。

JavaScript中对象的创建

基于{}符号创建对象

在JS中我们可以直接基于{}定义对象,在对象内容定义属性和方法,例如:

理解JavaScript中的对象

在JS中我们可以将对象理解为用于封装属性和方法的一个结构体,例如

理解JavaScript中的对象

如果需要反复创建多个相同结构的对象时,用{}代码就很冗余——重复。也不便于维护!

基于构造函数创建对象

假如在JS中我们希望非常方便的定义多个结构相同,但属性值不同的对象,可以直接基于构造函数( 定义同一类型多个对象的相同属性结构的特殊函数)进行对象创建,例如:

理解JavaScript中的对象

建议:只要反复创建多个相同结构的对象,都要用构造函数来创建对象.

在实际应用中我们尽量不要在构造函数中再去定义函数,例如:

理解JavaScript中的对象

这样在构建对象时,可能每次都需要开辟额外的函数空间.

JavaScript中的对象特性

封装特性

JS中的对象用于封装属性和方法.如图所示:

理解JavaScript中的对象

继承特性

JS中为了实现属性或方法的可重用性,提供了一种继承机制,

这种继承的方式需要借助Prototype对象去实现,Prototype对象是在定义构造函数时自动创建,用于存储所有共有属性和方法的一个对象,所有通过此构造函数构建的对象都继承这个原型对象.

构造函数中的原型对象分析,如图所示:

理解JavaScript中的对象

原型对象(ProtoType)对象的继承,如图所示:

理解JavaScript中的对象

在对象中添加共有属性,如图所示:

理解JavaScript中的对象

在对象中添加共有方法的.如图所示:

理解JavaScript中的对象

原型链是由多级父对象(原型对象)逐级继承形成的链式结构。这个原型链保存着一个对象可以访问的所有父级原型对象,以及这个对象可访问到的所有属性和方法。

多态特性

多态一般指同一个函数(行为),在不同情况下表现中的不同的状态。从应用上有两种形式,分别为重载和重写。

重载的定义:一个函数,根据传入的实参值不同,执行不同的逻辑。

重写的定义:在子对象中定义一个和父对象中成员同名的成员。只要从父对象继承来的东西不好用,就用重写自己的!

在子对象中定义一个和父对象中成员同名的自有成员,例如:

理解JavaScript中的对象

JavaScript内置对象类型

对象类型简介

JavaScript中对象的类型可以理解为构造方法和原型对象的结合体,当我们需要查看其对象类型时,可以通过构造方法名.

JS中内置的对象类型

JS中有11种内置对象类型,分别为String, Number, Boolean, Array, Date, RegExp, Math(对象), Error, Function, Object, global(对象)

总结(Summary)

本小节主要是对JS中对象做了简介,并通过实践方式分析JS中对象的创建,对象特性以及对象内置类型。

以上就是理解JavaScript中的对象的详细内容,更多关于JavaScript 对象的资料请关注三水点靠木其它相关文章!

Javascript 相关文章推荐
User Scripts: Video Download by User Scripts
May 14 Javascript
JQuery打造PHP的AJAX表单提交实例
Nov 03 Javascript
JavaScript极简入门教程(二):对象和函数
Oct 25 Javascript
浅谈javascript运算符——条件,逗号,赋值,()和void运算符
Jul 15 Javascript
jquery实现文本框的禁用和启用
Dec 07 Javascript
js 将input框中的输入自动转化成半角大写(税号输入框)
Feb 16 Javascript
js实现单张图片平移切换效果
Oct 11 Javascript
vue移动端下拉刷新和上拉加载的实现代码
Sep 08 Javascript
laydate如何根据开始时间或者结束时间限制范围
Nov 15 Javascript
Layui实现带查询条件的分页
Jul 27 Javascript
JS常见错误(Error)及处理方案详解
Jul 02 Javascript
Node实现搜索框进行模糊查询
Jun 28 Javascript
一文秒懂JavaScript构造函数、实例、原型对象以及原型链
Aug 25 #Javascript
node.js基础知识汇总
Aug 25 #Javascript
基于JS实现快速读取TXT文件
Aug 25 #Javascript
Vue实现简单的拖拽效果
Aug 25 #Javascript
浅谈JavaScript节流和防抖函数
Aug 25 #Javascript
JS实现拖动模糊框特效
Aug 25 #Javascript
PHP读取远程txt文档到数组并实现遍历
Aug 25 #Javascript
You might like
AM/FM收音机的安装与调试
2021/03/02 无线电
个人站长制做网页常用的php代码
2007/03/03 PHP
PHP调用wsdl文件类型的接口代码分享
2014/11/19 PHP
支持汉转拼和拼音分词的PHP中文工具类ChineseUtil
2018/02/23 PHP
php设计模式之备忘模式分析【星际争霸游戏案例】
2020/03/24 PHP
JavaScript-世界上误解最深的语言分析
2007/08/12 Javascript
Javascript 学习书 推荐
2009/06/13 Javascript
Jsonp 跨域的原理以及Jquery的解决方案
2010/05/18 Javascript
很好用的js日历算法详细代码
2013/03/07 Javascript
JS简单操作select和dropdownlist实例
2014/11/26 Javascript
百度地图自定义控件分享
2015/03/04 Javascript
jQuery实现弹出窗口中切换登录与注册表单
2015/06/05 Javascript
JavaScript前端开发之实现二进制读写操作
2015/11/04 Javascript
js实现C#的StringBuilder效果完整实例
2015/12/22 Javascript
js实现旋转木马效果
2017/03/17 Javascript
Vue.Draggable拖拽功能的配置使用方法
2020/07/29 Javascript
小程序接口的promise化的实现方法
2019/12/11 Javascript
extjs图表绘制之条形图实现方法分析
2020/03/06 Javascript
JavaScript实现Tab标签页切换的最简便方式(4种)
2020/06/28 Javascript
Python获取央视节目单的实现代码
2015/07/25 Python
python使用jieba实现中文分词去停用词方法示例
2018/03/11 Python
使用keras实现Precise, Recall, F1-socre方式
2020/06/15 Python
Python getattr()函数使用方法代码实例
2020/08/10 Python
详解anaconda安装步骤
2020/11/23 Python
如何使用amaze ui的分页样式封装一个通用的JS分页控件
2020/08/21 HTML / CSS
土木工程应届生求职信
2013/10/31 职场文书
内容编辑个人求职信
2013/12/10 职场文书
给儿子的表扬信
2014/01/15 职场文书
优秀团支部事迹材料
2014/02/08 职场文书
群众路线四风问题整改措施
2014/09/27 职场文书
2014大学班主任工作总结
2014/11/08 职场文书
2014年党风廉政工作总结
2014/12/03 职场文书
公司业务员管理制度
2015/08/05 职场文书
农村房屋租赁合同(范本)
2019/07/23 职场文书
MySQL大小写敏感的注意事项
2021/05/24 MySQL
Python编解码问题及文本文件处理方法详解
2021/06/20 Python