内容有点儿多,将分为两篇内容与大家分享。有的地方确实难以理解,可以多动手实现一下,看看效果。
一直听说有这么一句话,在JavaScript中,一切皆为对象。
经本人慎重研究之后发现,此言的确不虚。(这不废话么,虚不虚的还用你说。)
今天斗胆跟大家一起讨论一下JavaScript
重的Object
。了解Object
背后的 – 生活
阅读间隙,还得多注意休息哟~
1. 对象的创建
开始第一个小问题,看一下如何创建一个对象。创建对象有四(shi)种方式。以下几种方式都可创建一个对象,只不过创建之后的表现稍有不同。具体表现为原型和this
的指向问题。有兴趣的读者可点击查看相关文章。在这里我们就不详细介绍了。(偷个懒)
注意点:
四种方式创建对象,除了原型和this
指针表现不同,构造函数指向也有不同。(此时说明的是不手动指定构造函数的情况下)
- 字面量方式创建的对象。构造函数为
function Object() {}
- 构造函数创建。构造函数为函数本身
Object.create
创建的对象,构造函数为入参origin
的构造函数class
方式创建,会将本身也作为构造函数。
1.1 字面量方式创建
const obj = {
} // 构造函数为 [Function: Object]
1.2 构造函数创建
function Obj() {
}
const obj = new Obj() // 构造函数为 [Function: origin]
1.3 Object.create 创建
const origin = {
a: 1, b: 2}
const target = Object.create(origin) // 构造函数为 origin 的构造函数
1.4 class方式创建
class Origin {
}
const target = new Origin() // 构造函数 [Function: Origin]
2. 属性和方法
注:
-
官方版
- 属性是这个对象的属性,方法是这个对象所拥有的功能
-
通俗版
- 属性是一个值,不可执行。
- 方法为一个函数,可执行。
2.1 属性和方法获取
1.获取确定的key
属性,使用 .
运算符 或 中括号
const obj = {
a: 1,
b: 2,
c: 3,
d: function () {
}
}
obj.a === obj['a']// 1
obj.b === obj['b'] // 2
obj.c === obj['c'] // 3
obj.d === obj['d'] // function (){}
2.获取需要计算的kay
值,只能使用中括号方式
const obj = {
a1: 1,
a2: 2,
a3: 3,
a4: function (){
}
}
for(let i = 1;i < 5;i ++) {
obj['a' + i]
}
// 1,2,3,function (){}
注意:
如果对象中不含有某个key
,获取到的为 undefined
例如:
const obj = {
}
obj.c() // TypeError: obj.c is not a function
由于obj
中不含有c
这个方法,所以获取到的是undefined
。此值不是函数,