js-对象

1、js对象中既有属性又有方法；

创建对象的三种方式：

  • 通过对象字面量
  • new object
  • 构造函数的方法‘

2、对象字面量的方式：

<body>
  <!-- 1、定义一个对象 -->
  <script>
    // 创建一个对象
    var obj={
      name:'王者',
      age:18,
      sayhi:function(){
        console.log('sayhi');
      }
    }
    console.log(obj.name);
    console.log(obj['age']);
    obj.sayhi();
  </script>
  <!--总结  -->
  <!--
   1、调用对象的属性：对象名.属性名
   2、对象名['属性名']
   3、调用对象的方法：对象名.函数名（）；
   4、当成方法来调用
   -->
   <!-- 2、实现一个简单的案例 -->
   <script>
     var obj1={
       name:'可可',
       type:'阿拉斯加犬',
       age:5,
       color:'红棕色',
       voice:function(){
         console.log('汪汪');
       },
       chusheng:function(){
         console.log('牲畜');
       }
     }
     obj1.voice();
     obj1.chusheng();
   </script>
   </body>

3、new Object()来创建对象：

 <!-- 3、使用new Object()创建对象 -->
   <script>
    //  请用new Object形式创建一个鸣人对象。
    // 具体信息如下:
    // 姓名∶鸣人
    // 性别∶男
    // 年龄∶19岁
    // 技能( skill ) :影分身术  
    var obj1=new Object();
    //通过追加属性的方式
    obj1.name='鸣人';
    obj1.sex='男';
    obj1.age=19;
    obj1.skill=function(){
      console.log('影分身术！');
    }
    console.log(obj1.name);
     obj1.skill();

   </script>

 

4、构造函数的使用：

<body>
  <script>
    // 1、构造函数主要是对象中相同的属性和方法抽离出来，是一种比较特殊的函数，称之为构造函数
    //  构造函数可以实现批量地抽取出不同对象中的方法和属性
    // 使得大量的重复代码变得简单
    
      function Student(name,age,sex,score){
      this.name=name,
      this.age=age,
      this.sex=sex,
      this.score=score
    }
      var s1= new Student('小红','12','女','78');
      var s2= new Student('小王','13','男','98');
      var s3= new Student('小葱','11','女','100');
      // 构造函数不用return，函数调用的时候可以直接返回函数值
      console.log(s1.name);
      console.log(s2.age);

  </script>
  <!-- 
    构造函数使用框架：
    构造函数（）{
      this.属性名=传入的参数，
      this.属性名=传入的参数，
      this.属性名=传入的参数
    }
    调用：new 构造函数（）；
   -->
</body>

 

 4、构造函数一些简单的使用：

<script>
    // 1、构造函数主要是对象中相同的属性和方法抽离出来，是一种比较特殊的函数，称之为构造函数
    //  构造函数可以实现批量地抽取出不同对象中的方法和属性
    // 使得大量的重复代码变得简单
    
      function Student(name,age,sex,score){
      this.name=name,
      this.age=age,
      this.sex=sex,
      this.score=score,
      this.ablity=function(ambiton){
        console.log(name+'拥有的能力是：'+ambiton);
      }
    }
      var s1= new Student('小红','12','女','78');
      var s2= new Student('小王','13','男','98');
      var s3= new Student('小葱','11','女','100');
      // 构造函数不用return，函数调用的时候可以直接返回函数值
      console.log(s1.name);
      console.log(s2.age);
      s1.ablity('唱歌');
      s2.ablity('画画');

  </script>

利用构造函数创建两个英雄对象。函数中的公共部分包括:姓名属性(name) ,类型属性( type) , 血量属
性( blood )和攻击方式( attack)。

英雄对象的信息如下:
●廉颇力量型500血量攻击:近战
●后羿射手型100血量 攻击:远程

 // 5、一个例子
    function Hero(cname,ctype,blood){
      this.name=cname;
      this.type=ctype;
      this.blood=blood;
      this.attack=function(attack){
        console.log('英雄'+cname+'的攻击方式为'+attack);
       }
    }
    var lianpo=new Hero('廉颇','力量',500);
      var houyi=new Hero('后裔','射手',100);
      lianpo.attack('近战');
      houyi.attack('远程');

　　

 

总结构造函数的要点：（1）函数名首字母大写；

（2）不需要return 来进行返回；

（3）内部使用this关键字；

（4）调用函数，new关键字来创建对象。

 

posted @ 2022-03-30 23:10  starter123  阅读(70)  评论(0)    收藏  举报