一、对象的基本概念
在现实生活中,所有东西都可以看成对象,比如一台电脑,一个房子,一只猫,一个人,对象有他自己的属性,比如电脑有颜色,房子有尺寸,猫和人都有年龄。
在JavaScript中,对象是属性的集合,他也是一种数据类型。
二、自定义对象
我们可以通过一对花括号来创建一个对象 如下所示:
代码语言:javascript复制1 var obj = {};
在花括号中,我们可以为对象定义属性,下面我们来写一个猫的对象 示例代码如下:
代码语言:javascript复制1 var cat = {
2 //定义一个对象cat,它有两个属性,name和age
3 name:"喵喵",
4 age:2
5 }
6 //有两种方法可以获取到对象的属性值:1、对象名.属性名;2、对象名["属性名"]
7 console.log(cat.name);
8 console.log(cat["name"]);
三、方法
通过上面的例子我们可以知道name的属性值是字符串类型,age的属性值是数值类型。其实对象的属性值可以是任何数据类型,甚至可以是函数,如果对象的属性值是函数,那么我们叫这个属性为这个对象的方法 示例代码如下:
代码语言:javascript复制1 var cat = {
2 name:"喵喵",
3 age:2,
4 sayName:function(){
5 console.log("我是喵喵");
6 }
7 }
8 cat.sayName();
上面的代码可以在控制台输出“我是喵喵”,其中sayName是cat的方法。
方法简写
代码语言:javascript复制1 var cat = {
2 name:"喵喵",
3 age:2,
4 sayName(){
5 console.log("我是喵喵");
6 }
7 }
8 cat.sayName();
四、this关键字
在上面的例子中,我们可以给cat的那么属性重新赋值,代码如下 示例代码如下:
代码语言:javascript复制 1 var cat = {
2 name:"喵喵",
3 age:2,
4 sayName:function(){
5 console.log("我是喵喵")
6 }
7 }
8 cat.name = "小白";
9 console.log(cat.name); //输出"小白"
10 cat.sayName(); //输出"我是喵喵"
因为猫的名字已经改变,但是sayName方法里面的名字并没有一同变化,我们可以通过this关键字实现修改了名字,方法里面的名字也会改变。
在对象的方法中使用this,可以指向这个对象本身, 示例代码如下:
代码语言:javascript复制 1 var cat = {
2 name:"喵喵",
3 age:2,
4 sayName:function(){
5 console.log("我是" this.name)
6 }
7 }
8 cat.sayName(); //输出“我是喵喵”
9 cat.name = "小白";
10 console.log(cat.name); //输出"小白"
11 cat.sayName(); //输出“我是小白”
五、方法传参
给对象的方法传递参数和给函数传递参数是一样的,下面我们来定义一个会算数的猫 示例代码如下:
代码语言:javascript复制 1 var cat = {
2 name:"喵喵",
3 age:2,
4 sayName:function(){
5 console.log("我是" this.name)
6 },
7 count:function(num1,num2){
8 console.log(num1 num2);
9 }
10 }
11
12 cat.sayName();
13 cat.count(10,20);
我们在之前代码的基础上,有添加了一个count方法可以让猫可以计算两个数的加和,我们只要传入实参,猫就能计算结果。
六、对象展开运算符
代码语言:javascript复制1 let xiaoMing = {name:"小明",age:2}
2 let superXiaoMing = {weight:"1000kg",fly:true}
3 let superHero = {
4 ...xiaoming,
5 ...sukperXiaoming
6 }
7 console.log(superHero)
七、课后练习
定义一个对象dog,实现功能如下:
- 具有一个name属性名为
Doggy
。 - 具有一个number属性,初始值为0.
- 具有一个counting(数数)方法,每次执行方法时,number属性会增加1。