初步认识面向对象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

    推荐阅读