【学习笔记】深入理解js原型和闭包(1)—— 一切都是对象
“一切都是对象”这句话的重点在于如何去理解“对象”这个概念。
——当然,也不是所有的都是对象,值类型就不是对象。
首先咱们还是先看看javascript中一个常用的运算符——typeof。typeof应该算是咱们的老朋友,还有谁没用过它?
typeof函数输出的一共有几种类型,在此列出:
function show(x) {
console.log(typeof x); // undefined
console.log(typeof 10); // number
console.log(typeof 'abc'); // string
console.log(typeof true); // boolean
console.log(typeof function () {}); //function
console.log(typeof [1, 'a', true]); //object
console.log(typeof { a: 10, b: 20 }); //object
console.log(typeof null); //object
console.log(typeof new Number(10)); //object
}
show();
以上代码列出了typeof输出的集中类型标识,其中上面的四种(undefined, number, string, boolean)属于简单的值类型,不是对象。剩下的几种情况——函数、数组、对象、null、new Number(10)都是对象。他们都是引用类型。
判断一个变量是不是对象非常简单。值类型的类型判断用typeof,引用类型的类型判断用instanceof。
var fn = function () { };
console.log(fn instanceof Object); // true
好了,上面说了半天对象,各位可能也经常在工作中应对对象,在生活中还得应对活生生的对象。有些个心理不正常或者爱开玩笑的单身人士,还对于系统提示的“找不到对象”耿耿于怀。那么在javascript中的对象,到底该如何定义呢?
对象——若干属性的集合。
java或者C#中的对象都是new一个class出来的,而且里面有字段、属性、方法,规定的非常严格。但是javascript就比较随意了——数组是对象,函数是对象,对象还是对象。对象里面的一切都是属性,只有属性,没有方法。那么这样方法如何表示呢?——方法也是一种属性。因为它的属性表示为键值对的形式。
而且,更加好玩的事,javascript中的对象可以任意的扩展属性,没有class的约束。这个大家应该都知道,就不再强调了。
先说个最常见的例子:

以上代码中,obj是一个自定义的对象,其中a、b、c就是它的属性,而且在c的属性值还是一个对象,它又有name、year两个属性。
这个可能比较好理解,那么函数和数组也可以这样定义属性吗?——当然不行,但是它可以用另一种形式,总之函数/数组之流,只要是对象,它就是属性的集合。
以函数为例子:
var fn = function () {
alert(100);
};
fn.a = 10;
fn.b = function () {
alert(123);
};
fn.c = {
name: "王福朋",
year: 1988
};
上段代码中,函数就作为对象被赋值了a、b、c三个属性——很明显,这就是属性的集合吗。
你问:这个有用吗?
回答:可以看看jQuery源码!
在jQuery源码中,“jQuery”或者“$”,这个变量其实是一个函数,不信你可以叫咱们的老朋友typeof验证一下。
console.log(typeof $); // function
console.log($.trim(" ABC "));
验明正身!的确是个函数。那么咱们常用的 $.trim() 也是个函数,经常用,就不用验了吧!
很明显,这就是在$或者jQuery函数上加了一个trim属性,属性值是函数,作用是截取前后空格。
javascript与java/C#相比,首先最需要解释的就是弱类型,因为弱类型是最基本的用法,而且最常用,就不打算做一节来讲。
其次要解释的就是本文的内容——一切(引用类型)都是对象,对象是属性的集合。最需要了解的就是对象的概念,和java/C#完全不一样。所以,切记切记!
最后,有个疑问。在typeof的输出类型中,function和object都是对象,为何却要输出两种答案呢?都叫做object不行吗?——当然不行。
具体原因,且听下回分解!
-------------------------------------------------------------------------------------------------------------------------
本文已更新到《深入理解js原型和闭包》的目录更多内容可参考《深入理解js原型和闭包》
【学习笔记】深入理解js原型和闭包(1)—— 一切都是对象的更多相关文章
- 【学习笔记】深入理解js原型和闭包(0)——目录
文章转载:https://www.cnblogs.com/wangfupeng1988/p/4001284.html 说明: 本篇文章一共16篇章,外加两篇后补的和一篇自己后来添加的学习笔记,一共19 ...
- 【学习笔记】深入理解js原型和闭包系列学习笔记——精华
深入理解js原型和闭包笔记: 1.“一切皆是对象”,对象是属性的集合. 丨 函数也是对象,但是使用typeof时为什么函数返回function而 丨 不是object呢,js为何要对函数做这样的区分 ...
- 【学习笔记】深入理解js原型和闭包(16)——完结
之前一共用15篇文章,把javascript的原型和闭包讲解了一下. 首先,javascript本来就“不容易学”.不是说它有多难,而是学习它的人,往往都是在学会了其他语言之后,又学javascrip ...
- 【学习笔记】深入理解js原型和闭包(18)——补充:上下文环境和作用域的关系
本系列用了大量的篇幅讲解了上下文环境和作用域,有些人反映这两个是一回儿事.本文就用一个小例子来说明一下,作用域和上下文环境绝对不是一回事儿. 再说明之前,咱们先用简单的语言来概括一下这两个的区别. 0 ...
- 【学习笔记】深入理解js原型和闭包(17)——补this
本文对<深入理解js原型和闭包(10)——this>一篇进行补充,原文链接:https://www.cnblogs.com/lauzhishuai/p/10078307.html 原文中, ...
- 【学习笔记】深入理解js原型和闭包(15)——闭包
前面提到的上下文环境和作用域的知识,除了了解这些知识之外,还是理解闭包的基础. 至于“闭包”这个词的概念的文字描述,确实不好解释,我看过很多遍,但是现在还是记不住. 但是你只需要知道应用的两种情况即可 ...
- 【学习笔记】深入理解js原型和闭包(14)——从【自由变量】到【作用域链】
先解释一下什么是“自由变量”. 在A作用域中使用的变量x,却没有在A作用域中声明(即在其他作用域中声明的),对于A作用域来说,x就是一个自由变量.如下图 如上程序中,在调用fn()函数时,函数体中第6 ...
- 【学习笔记】深入理解js原型和闭包(13)——【作用域】和【上下文环境】
上文简单介绍了作用域,本文把作用域和上下文环境结合起来说一下,会理解的更深一些. 如上图,我们在上文中已经介绍了,除了全局作用域之外,每个函数都会创建自己的作用域,作用域在函数定义时就已经确定了.而不 ...
- 【学习笔记】深入理解js原型和闭包(12)——简介【作用域】
提到作用域,有一句话大家(有js开发经验者)可能比较熟悉:“javascript没有块级作用域”.所谓“块”,就是大括号“{}”中间的语句.例如if语句: 再比如for语句: 所以,我们在编写代码的时 ...
- 【学习笔记】深入理解js原型和闭包(11)——执行上下文栈
继续上文的内容. 执行全局代码时,会产生一个执行上下文环境,每次调用函数都又会产生执行上下文环境.当函数调用完成时,这个上下文环境以及其中的数据都会被消除,再重新回到全局上下文环境.处于活动状态的执行 ...
随机推荐
- Redis实现中间件(订阅)
什么是消息中间件 发布订阅 点对点 消息中间件本身是异步的通讯 案例:使用redis实现发布订阅功能 Redis发布订阅 Redis 发布订阅(pub/sub)是一种消息通信模式:发送者(pub) ...
- hdu2063 二分图(基础题)
这个题目适合刚刚接触二分图的同学做哦: 给一个题目链接 点击打开链接. 题目大意,有K个男女匹配方式, 输入数据的第一行是三个整数K , M , N,分别表示可能的组合数目,女生的人数,男生的人数.0 ...
- python中optparse模块用法
optparse模块主要用来为脚本传递命令参数,采用预先定义好的选项来解析命令行参数. 首先需要引入optparser模块,然后执行初始化,实例化一个OptionParser对象(可以带参,也可以不带 ...
- Ubuntu上命令行下卸载软件
sudo apt-get --purge remove 软件名 (加了--purge表示会删除配置) sudo apt-get autoremove (这个命令后面文章有解释) dpkg -l (查看 ...
- [Selenium] 如何在老版本的Chrome 浏览器上使用selenium
由于Chrome Driver 只兼容Chrome 浏览器12.0.712.0 和之后的新版本,会因此如果要在老版本的Chrome 浏览器上使用Selenium, 则只能使用 SeleniumRC ...
- 「NOIP2012」「LuoguP1083」 借教室
Description 在大学期间,经常需要租借教室.大到院系举办活动,小到学习小组自习讨论,都需要向学校申请借教室.教室的大小功能不同,借教室人的身份不同,借教室的手续也不一样. 面对海量租借教室的 ...
- 字符串转Unicode码
var str = '中'; var charCode = str.charCodeAt(0); console.log(charCode); // => 20013; str.charCode ...
- codeforces round 420 div2 补题 CF 821 A-E
A Okabe and Future Gadget Laboratory 暴力 #include<bits/stdc++.h> using namespace std; typedef l ...
- bzoj1003物流运输——DP
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1003 DP好题: 直接找一个时间段的最短路,并用它来预处理出每个时间段的最小花费: f[i] ...
- emacs在org-mode时输出pdf时,只输出为链接
这个找到问题了,写错格式了,输出pdf中要内嵌图像,格式要写成[[file:/home/xxx/yyy.jpg]],不能写成file:/home/xxx/yyy.jpg或者[[file:/home/x ...