JS高级学习历程-7

【面向(基于)对象】

1 创建对象

在php里边,需要先找到一个类别,在通过类创建具体对象

在javascript里边,可以直接创建具体对象,后期可以再给对象丰富许多属性或方法。

1. 字面量方式创建对象

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>21-创建对象</title>
 6     <script type="text/javascript">
 7       //① 创建对象,字面量方式
 8       var cat = {};
 9 
10       //给对象声明相关的属性 和 方法
11       cat.color = "yellow";
12       cat.age = 5;
13       cat.run = function(){
14           console.log('走直线');
15       }
16       console.log(cat);
17     </script>
18 </head>
19 <body>
20     
21 </body>
22 </html>
21-创建对象

 

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>22-创建对象</title>
 6     <script type="text/javascript">
 7       //① 创建对象,字面量方式(json数据格式)
 8       //成员名称是否设置引导都没有关系
 9       var dog = {name:'哈巴','age':1,hobby:function(){console.log('看家护林')}};
10       console.log(dog);
11 
12       //对象访问自己的成员:对象.成员 对象[成员名称]
13       console.log(dog.name);  //哈巴
14       console.log(dog.age);  //1
15       console.log(dog['age']);  //1
16       dog.hobby();  //看家护林
17   
18     </script>
19 
20 </head>
21 <body>
22     
23 </body>
24 </html>
22-创建对象

2. 构造函数方式创建对象

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>24-创建对象</title>
 6     <script type="text/javascript">
 7       //②构造函数 创建对象
 8       /*
 9         在javascript里面可以通过一个“函数”创建具体对象,通过new关键字即可
10         这个创建对象的函数称为“构造函数”,这个函数在创建对象的同时会自动
11         执行
12       */
13       function Animal(){
14           this.color = "yellow";
15           this.age = 3;
16           this.run = function(){
17               console.log('在跑步');
18           }
19       }
20       var dog = new Animal();
21       var cat = new Animal();
22       /*
23         构造函数创建对象的步骤
24         ① 创建this关键字,this指向null
25         ② 创建dog变量
26         ③ 把this关键字指向dog
27         ④ 为this丰富成员变量信息,也就是为dog丰富成员
28       */
29       console.log(dog);//Animal { color="yellow", age=3, run=function()}
30     </script>
31 </head>
32 <body>
33     
34 </body>
35 </html>
24-创建对象

3. 通过Object创建对象

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>25-创建对象</title>
 6     <script type="text/javascript">
 7       //③ Object创建对象
 8       var cat = {name:'kitty',age:3};
 9       console.log(cat);//Object { name="kitty", age=3 }
10       // 以上cat是通过Object构造函数创建出来的对象
11       // 之后又维护了两个属性:name和age
12 
13       var dog = new Object();
14       dog.weight = 40;
15       dog.addr = "德国";
16       console.log(dog);//Object { weight=40, addr="德国"}
17     </script>
18 </head>
19 <body>
20     
21 </body>
22 </html>
25-创建对象

转载于:https://www.cnblogs.com/daipianpian/p/4531436.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值