初步认识面向对象2

  • 1.面向对象一般写法:
1.创建对象,可以通过函数来创建一个对象
    function dog(){
/*1.1创建一个对象*/
        var obj = new Object();
/*1.2设置属性*/
        obj.name = '小花';
        obj.age = 0;
        obj.dogFrends = ['小黄','小白'];
        obj.eat = function(){
            console.log('吃牛奶');
        }
        obj.run = function(){
            console.log('我家');
        }
/*返回这个对象*/
        return obj;
    }
    var smallDog = dog();
    console.log(smallDog.name);
    var bigDog = dog();
    console.log(bigDog.age);
  • 2.面向对象传递参数:
1.创建对象,可以通过函数来创建一个对象
    function dog(name,age,dogFriends){
/*1.1创建一个对象*/
        var obj = new Object();
/*1.2设置属性*/
        obj.name = name;
        obj.age = age;
        obj.dogFrends = dogFriends;
        obj.eat = function(){
            console.log('吃牛奶');
        }
        obj.run = function(){
            console.log('我家');
        }
/*返回这个对象*/
        return obj;
    }
    var smallDog = dog('小花',0,['小白','小黄']);
    console.log(smallDog.age);
    var bigDog = dog('大花',2,['大白','大黄']);
    console.log(bigDog.age);
  • 3.使用this接收参数:
1.创建对象,可以通过函数来创建一个对象
    function dog(name,age,dogFriends){
/*1.1创建一个对象*/
        var obj = new Object();
/*1.2设置属性*/
        this.name = name;
        this.age = age;
        this.dogFrends = dogFriends;
        this.eat = function(){
            console.log('吃牛奶');
        }
        this.run = function(){
            console.log('我家');
        }
/*返回这个对象*/
        return obj;
    }
    var smallDog = dog('小花',0,['小白','小黄']);
    console.log(smallDog.age);
    var bigDog = dog('大花',2,['大白','大黄']);
    console.log(bigDog.age);
  • 通过这种方式创建地对象可以作为模板,但是我们创建的过程需要创建一个对象,而且每次都需要返回这个对象,所以我们需要改造这个方法。
  • 4.使用构造函数创建对象:
1.创建对象,可以通过构造函数来创建一个对象
    function Dog(name,age,dogFriends){
/*1.2设置属性*/
        this.name = name;
        this.age = age;
        this.dogFrends = dogFriends;
        this.eat = function(someThing){
            console.log( this.name+'吃'+someThing);
        }
        this.run = function(someWhere){
            console.log(this.name +'跑'+someWhere);
        }
    }
    var smallDog = new Dog('小花',0,['小白','小黄']);
    console.log(smallDog.age);
    var bigDog = new Dog('大花',2,['大白','大黄']);
    console.log(bigDog.age);
    smallDog.eat('奶');
    bigDog.eat('牛肉');
  • 5.使用构造函数创建对象优化参数
    因为参数较多的时候,我们写起来不容易,所以我们抽取一个用来存储参数的数据,这个数据一般是字典。
1.创建对象,可以通过构造函数来创建一个对象
    function Dog(option){
/*1.0判断是否传入字典*/
        var option = option ||{};
/*1.1设置属性*/
        this.name = option.name;
        this.age = option.age;
        this.dogFrends = option.dogFrends;
        this.eat = function(someThing){
            console.log( this.name+'吃'+someThing);
        }
        this.run = function(someWhere){
            console.log(this.name +'跑'+someWhere);
        }
    }
    var smallDog = new Dog({name:'小花',age:0,dogFriends:['小白','小黄']});
    console.log(smallDog.age);
    var bigDog = new Dog({name:'大花',age:2,dogFriends:['大白','大黄']});
    console.log(bigDog.age);
    smallDog.eat('奶');
    bigDog.eat('牛肉');
    alert(smallDog.eat == bigDog.eat);  //false
  • 通过购造函数创建出来的对象每一个都是一个新的对象
  • 他们里面的同名方法不是一样的
  • 但是我们这些方法实现的功能是一样的
  • 所以我们没有必要每次创建一个对象都设置方法
  • 最好,让这些创建的对象拥有的是同样的方法
  • 6.使用原型对象
1.创建对象,可以通过构造函数来创建一个对象
    function Dog(option){
/*1.0判断是否传入字典*/
        var option = option ||{};
/*1.1设置属性*/
        this.name = option.name;
        this.age = option.age;
        this.dogFrends = option.dogFrends;
 }
    Dog.prototype = {
        eat:function(someThing){
            console.log( this.name+'吃'+someThing);
        },
        run:function(someWhere){
            console.log(this.name +'跑'+someWhere);
        }
    }
    var smallDog = new Dog({name:'小花',age:0,dogFriends:['小白','小黄']});
    console.log(smallDog.age);
    var bigDog = new Dog({name:'大花',age:2,dogFriends:['大白','大黄']});
    console.log(bigDog.age);
    smallDog.eat('奶');
    bigDog.eat('牛肉');
  • 7.创建对象最结版:
 /*1.创建对象,可以通过构造函数来创建一个对象
    function Dog(option){
/*当使用对应的构造函数创建对象的时候,我们首先调用初始化函数*/
        this._init(option);
    }
//设置原型对象
    Dog.prototype = {
/*如果放置属性一般通过初始化方法来放置属性*/
        _init:function(option){
/*1.1设置属性*/
            var option = option ||{};
            this.name = option.name;
            this.age = option.age;
            this.dogFrends = option.dogFrends;
        },//设置方法
        eat:function(someThing){
            console.log( this.name+'吃'+someThing);
        },
        run:function(someWhere){
            console.log(this.name +'跑'+someWhere);
        }
    }
    var smallDog = new Dog({name:'小花',age:0,dogFriends:['小白','小黄']});
    console.log(smallDog.age);
    var bigDog = new Dog({name:'大花',age:2,dogFriends:['大白','大黄']});
    console.log(bigDog.age);
    smallDog.eat('奶');
    bigDog.eat('牛肉');
  • 8.this的认识
  • this表示的意义:
    this一般放在函数(方法)中,如果哪个对象拥有这个函数(哪个对象调用这个函数)那么this就表示这个对象
    所有的全局变量和方法都是window的属性和方法
    function dog(){
        alert(this);
    }
    dog();
//   任何一个函数动都可以通过new来创建一个对象,所以我们这个dog函数属于新创建的对象,所以这个this表示新创建地对象.
   new dog();
  • this的特殊的用法:
    如果this在事件指令中,表示事件触发者,一般是事件源
    如果this在定时器中,表示window
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 工厂模式类似于现实生活中的工厂可以产生大量相似的商品,去做同样的事情,实现同样的效果;这时候需要使用工厂模式。简单...
    舟渔行舟阅读 12,385评论 2 17
  • 开篇废话是一种情怀 在我们开始学习面向对象之前,首先得先想一个问题,那就是何为对象? 在日常生活中我们有男朋友\女...
    西巴撸阅读 3,443评论 4 3
  • 一、面向过程和面向对象的区别、联系 1.面向过程编程:注重解决问题的步骤,分析问题需要的每一步,实现函数依次调用。...
    空谷悠阅读 4,367评论 1 11
  • 单例模式 适用场景:可能会在场景中使用到对象,但只有一个实例,加载时并不主动创建,需要时才创建 最常见的单例模式,...
    Obeing阅读 6,380评论 1 10
  • 人们 我指的是人们 除了急切 无以言表的人们 对于时代病症快刀切断的那双手 也被他们斩断成散落天南海北的 陌生面孔...
    乌鸦之白阅读 2,662评论 6 3