研磨JavaScript系列(五):奇妙的对象
在JavaScript中,只有object和function两种东西有对象化的能力。我们先来说说函数的对象化能力。
任何一个函数都可以为其动态地添加或去除属性,这些属性可以是简单类型,可以是对象,也可使其他的函数。也就是说,函数具有对象的全部特征,完全可以把函数当对象来用。其实,函数就是对象,只不过比一般的对象多了一个括号"()"操作符,这个操作符用来执行函数的逻辑,即函数本身还可以被调用,一般对象不可以被调用。除此之外,完全相同。
<script type="text/javascript">
function sing(){
alert(sing.author + "正唱着" + sing.song);
} sing.author = "张信哲";
sing.song = "爱如潮水";
sing(); //输出张信哲正唱着爱如潮水 sing.author = "林志炫";
sing.song = "蒙娜丽莎的眼泪";
sing(); //输出林志炫正唱着蒙娜丽莎的眼泪
</script>
在这段代码中,sing函数被定义后,又给sing函数动态的增加了author和song属性。将author和song属性设为不同的演唱者和歌曲,在调用sing()时,就能显示出不同的结果。这个示例让我们理解了JavaScript函数就是对象的本质,也感受到了JavaScript语言的优美。
我们应该是理解了function类型的东西都是和object类型一样的东西,这种东西被我们称为对象。我们的确可以这样去看待这些对象,因为它们既有属性,也有方法。
我们看下面的代码,可能会让我们产生新的疑惑。
<script type="text/javascript">
var anObject = {};
anObject.aProperty = "Property of object"; //对象的一个属性
anObject.aMethod = function(){ alert("Method of object"); }; //对象的一个方法 alert(anObject["aProperty"]); //可以将对象当数值以属性名作为下标来访问属性
alert(anObject["aMethod"]); //可以将对象当数组以方法名作为下标来访问方法 //遍历对象所有属性和方法进行迭代处理
for (var s in anObject){
alert(s + " is a " + typeof(anObject[s]));
}
</script>
对于function类型的对象也一样
<script type="text/javascript">
var aFunction = function(){}; //一个函数
aFunction.aProperty = "Property of object"; //函数的一个属性
aFunction.aMethod = function(){ alert("Method of object"); }; //函数的一个方法 alert(aFunction["aProperty"]); //可以将函数当数组以属性名作为下标来访问属性
alert(aFunction["aMethod"]); //可以将函数当数组以方法名作为下标来访问方法 //遍历函数所有属性和方法进行迭代处理
for (var s in aFunction){
alert(s + " is a " + typeof(aFunction[s]));
}
</script>
是的,对象和函数可以入数组一样,用属性名或方法名作为下标来访问并处理。
文章声明:本文部分内容参考自《悟透JavaScript》,这是一本学习JavaScript非常好的书。
研磨JavaScript系列(五):奇妙的对象的更多相关文章
- 研磨JavaScript系列
JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言.同时也是一种广泛用于客户端Web开发的脚本语言,常用来给HTML网页添加动态功能,比如响应用户的各种操作.它最初由网景公司 ...
- 研磨JavaScript系列(四):代码的时空
对于过程式编程来说,代码执行的时间与数据标识的空间是密不可分的.我们只有把指令执行的具体时刻与标识映射的具体地址结合起来,才能确定程序在执行瞬间的上下文状态.于是,代码时刻与数据标识的结构,就形成了作 ...
- JavaScript系列----一切皆是对象
1.判断对象类型 1.1.typeof 运算符 首先要认识到,typepof是一个运算符,其运算需要一个参数,返回值是参数的类型. typeof使用方法 typeof parameter //使用方法 ...
- 研磨JavaScript系列(一):回归简单
想要理解JavaScript,你得首先放下对象和类的概念,回到数据和代码的本原.编程世界只有数据和代码两种基本元素,而这两种元素又有着纠缠不清的关系.JavaScript就是把数据和代码都简化到最原始 ...
- 研磨JavaScript系列(二):没有类
object就是对象的类型.在JavaScript中不管多么复杂的数据和代码.都可以组织成object形式的对象. 但JavaScript没有"类"概念. 看下面这段JavaScr ...
- 研磨JavaScript系列(三):函数的魔力
JavaScript的代码中就只有function一种形式,function就是函数的类型.在其他的编程语言中可能还存在Procedure或者是method等代码概念,在JavaScript中只有fu ...
- JavaScript 系列博客(五)
JavaScript 系列博客(五) 前言 本篇博客学习 js 选择器来控制 css 和 html.使用事件(钩子函数)来处理事件完成后完成指定功能以及js 事件控制页面内容. js 选择器 在学习 ...
- JavaScript 系列--JavaScript一些奇淫技巧的实现方法(二)数字格式化 1234567890转1,234,567,890;argruments 对象(类数组)转换成数组
一.前言 之前写了一篇文章:JavaScript 系列--JavaScript一些奇淫技巧的实现方法(一)简短的sleep函数,获取时间戳 https://www.mwcxs.top/page/746 ...
- javascript系列之变量对象
原文:javascript系列之变量对象 引言 一般在编程的时候,我们会定义函数和变量来成功的构造我们的系统.但是解析器该如何找到这些数据(函数,变量)呢?当我们引用需要的对象时,又发生了什么了? 很 ...
随机推荐
- 【Codeforces 986B】Petr and Permutations
[链接] 我是链接,点我呀:) [题意] 题意 [题解] n为奇数时3n和7n+1奇偶性不同 n为偶数时也是如此 然后交换任意一对数 逆序对的对数的奇偶性会发生改变一次 求出逆序对 对n讨论得出答案. ...
- [luoguP2434] [SDOI2005]区间(贪心)
传送门 简单贪心 ——代码 #include <cstdio> #include <iostream> #include <algorithm> int n, l, ...
- [K/3Cloud]K3Cloud的移动审批方面
基于最新的K3Cloud2的SP2,当前K3Cloud上所有的工作流都可以在移动手机上进行移动审批,具体如下: K/3 Cloud 支持移动审批,支持安卓和IOS. 关于申请试用: 1.打开浏览器,进 ...
- 轰炸II
题目背景 本题为轰炸数据加强版 题目描述 一个城市遭到了M次轰炸,每次都炸了一个每条边都与边界平行的矩形 在轰炸后,有N个关键点,指挥官想知道,它们有没有受到过轰炸,如果有,被炸了几次,最后一次是第几 ...
- 分享一个灰常好的 dapper 扩展插件: Rainbow
dapper 是一个效率非常高的orm 框架 ,效率要远远大于 我们大微软的EF . 它只有一个类文件,非常之小.(在 EF 5.0 后 微软已经做了 改进) ps; 由于之前我也没测试过,只 ...
- Ubuntu 16.04通过Trickle限制某个软件的下载/上传速度
在Linux下没有Windows使用360那样去限制某个软件的速度. 但是通过Trickle可以设置某个软件的网速,但是前提是通过Trickle命令连带启动这个软件才可以,不能中途去设置. 比如现在很 ...
- NETCore项目报错 An error occurred while starting the application
在发布到IIS的webApi项目中,运行时报出以上错误, 解决方法: 1.打开发布目录文件夹,找到web.config文件 2.打开web.config找到stdoutLogEnabled=" ...
- PHP array_pad()
定义和用法 array_pad() 函数向一个数组插入带有指定值的指定数量的元素. 语法 array_pad(array,size,value) 参数 描述 array 必需.规定数组. size 必 ...
- 一份关于jvm内存调优及原理的学习笔记(转)
JVM 一.虚拟机的基本结构 1.jvm整体架构 类加载子系统:负责从文件系统或者网络中加载class信息,存入方法区中. 方法区(Perm):存放加载后的class信息,包括静态方法,jdk1.6以 ...
- [Vue @Component] Extend Vue Components in TypeScript
This lesson shows how you can extend and reuse logic in Vue components using TypeScript inheritance. ...