JavaScript 面向对象

创建对象

JavaScript 传统的创建对象方法有点怪异,是用函数的形式封装。

function Animal(name) {
 this.name = name // 属性
 this.sleep = function() { // 方法
  return 'zzZZ~'
 }
}

// 上面看起来向一个函数,但实际上它是一个对象,如果你使用 “new” 的方式执行它
var cat = new Animal('cat')

console.log(cat.name) // cat
console.log(cat.sleep()) // sleep

prototype

默认下的两个实例之间是各自独立的,所以 JavaScript 在每个对象上都绑定了一个 prototype 对象,通过 prototype 将所有的对象关联起来。

/* 例 1. */
function Animal(name) {
 this.name = name
 this.sleep = function() {
  return 'zzZZ~'
 }
}

var cat = new Animal('cat')
var dog = new Animal('dog')

console.log(cat.sleep === dog.sleep) // false | 实例与实例之间的独立的

/* 例 2. */
function Animal(name) {
 this.name = name // 私有
}

Animal.prototype.sleep = function() { // 共享
  return 'zzZZ~'
 }

var cat = new Animal('cat')
var dog = new Animal('dog')

console.log(cat.sleep === dog.sleep) // true | 通过 prototype 的关联,实例之间实现了 “数据共享”

继承关系

对象与对象之间的继承关系,由于是通过 prototype 关联,所以这个继承关系通常也被称为 原型链

/* 
 cat 继承关系  
 cat -> Animal -> Object -> null
*/
cat.__proto__ === Animal.prototype // true
Animal.prototype.__proto__ === Object.prototype // true
Object.prototype.__proto__ === null // true


/*
 Array 继承关系
 [] -> Array.prototype -> Object.prototype -> null
*/
 [].__proto__ === Array.prototype // true
 Array.prototype.__proto__ === Object.prototype // true
 Object.prototype.__proto__ === null // true


// prototype 属性 | 指向当前对象的 prototype
// __proto__ 属性 | 指向父类对象的 prototype
// JavaScript 中所有对象最终都继承自 null 对象

dir

列出当前对象的方法。

dir(Array) // ...
dir(Object) // ...

/*
 dir 列出的方法中有一项 “prototype”,里面的所有方法都是共享的
 由于 [] 继承了 Array ,Array 继承了 Object,所以能使用他们的方法
*/

// [1,2,3].pop
// [1,2,3].constructor
// ...

属性检验

属性的验证方法。

/* in | 可以验证 “私有” “公有” “父类” 的所有能方法 */
'constructor' in [] // true
'pop' in [] // true

/* hasOwnProperty | 只验证私有方法 */
cat.hasOwnProperty('name') // true
cat.hasOwnProperty('constructor') // false

instanceof

实例归属。

// [] 是 Array 的实例 ?

[] instanceof Array //  trur
Array instanceof Object // true
更多教程 HTML5 教程 CSS3 教程 JavaScript 教程 JQuery 教程 React.js 教程 Node.js 教程 Koa2 教程 Python 教程 Linux 教程