码迷,mamicode.com
首页 > 编程语言 > 详细

javascript 面向对象基础 (1)

时间:2017-05-21 00:27:36      阅读:219      评论:0      收藏:0      [点我收藏+]

标签:16px   面向   aaa   返回值   不同   存在   size   创建对象   cti   

常见的创建对象的方式有3种:

① 声明变量的方式

 

var obj1 = { key1: "val1", key1: "val2", show: function () { console.log(this.key1) } }
var array = [1, 2, 3];

 

可以给 obj1 继续添加属性和方法,如:

obj1.color = "red";
obj1.hideen = function () { console.log("aaa") };

 使用操作符 new

var obj2 = new Object();

可以给 obj2 继续添加属性和方法,如:

obj2.name = "madom";
obj2.show = function () { console.log("aaa") };

③ 创建构造函数

function Cat() {             
  this.age = "18";   this.show = function () {     console.log(this.age);   } }

 

其实,构造函数 也是普通函数,只有当 new 操作的时候才是构造函数,

通过构 造函数 创建实例对象。每一个对象都有自己的内部原型 proto_

各个实例对象之间并不相同。

 

var cat1 = new Cat(); 
cat1.__proto__ === Cat.prototype; //true
var cat2 = new Cat(); 
cat2.__proto__ === Cat.prototype; //true 
cat1 === cat2; // fals  

再创建一个带有 return 的构造函数

function Bird() {
    this.age = 19;
    this.say = function () { console.log(‘my age is ‘ + 19) };
    return {
        name: ‘Tim‘,
        say: function () { console.log(‘hello ‘ + this.name) },
    };
}

创建一个对象实例,看看有什么不同

var bird = new Bird();
bird.say(); // hello Tim
console.log(bird); // Object {name: "Tim", say: function}

发现:如果构造函数有 return,则对象实例无法使用构造函数 return 之前的属性和方法


 

new 操作时内部的运作大致如下:
第1步: 在内存中开辟一块空间。
第2步: 创建一个新空对象,并把 this 指向到这个空对象。
第3步: 把空对象的 内部原型 指向 构造函数的 原型对象。
第4步: 当构造函数执行完成后,如果 没有 return(返回值) 的话,
则构造函数末尾存在 ‘隐式’ 的 return this;如果  return(返回值),则将返回值赋值给对象实例。

对创建实例的操作做如下模拟(非真实执行):

 

var cat1 = new Cat();
/* this = { };
 * this._proto_ = Cat.prototype
 * this = cat1;
 * return this
 */

 

 

 

--- 知识在于分享,转载请注出处 ---

 

javascript 面向对象基础 (1)

标签:16px   面向   aaa   返回值   不同   存在   size   创建对象   cti   

原文地址:http://www.cnblogs.com/cokid/p/6883632.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!