前端学习之路3-JavaScript面向对象

js中的对象，最简单的是字面量对象

var obj={
	name:'tom',
	getName:function(){
		return this.name
	}
}

对象属性可以为基本类型，对象和函数。同时支持动态添加修改属性。

原型

每个对象都含有原型的引用，当查找属性时，若对象本身不具有该属性，则会查找原型上是否有该属性。
在JavaScript中，对象的原型属性是内置属性（使用标记[[prototype]]），无法直接访问。相反，内置的方法Object.setPrototypeOf需要传入两个对象作为参数，并将第二个对象设置为第一个对象的原型。
但是要注意的是如果在实例中定义了一个和原型中同名的方法，实例会隐藏原型的方法。

继承

原型复制：

function Person(){}
Person.prototype.dance=function(){}

function Ninja(){}
Ninja.prototype={dance: Person.prototype.dance}

原型继承：

function Person(){}
Person.prototype.dance=function(){}

function Ninja(){}
Ninja.prototype= new Person()

class

注意class是es6中的语法糖，底层仍是原型的实现

class Ninja{
	constructor(name){
		this.name=name
	}

	swingSword(){
		return true;
	}
}

var ninja=new Ninja("hh")

封装

getter，setter

const ninjaCollection={
	ninjas:["a","b"],
	get firstNinja(){
		return this.ninjas[0];
	},
	set firstNinja(value){
		this.ninjas[0]=value;
	}
}

也可以通过内置的Object.defineProperty定义

Object.defineProperty(obj, prop, desc)

Object.defineProperty(obj, 'key', {
  enumerable: false,
  configurable: false,
  writable: false,
  value: 'static'
});

Object.defineProperty(o, 'a', {
  value: 37,
  writable: true,
  enumerable: true,
  configurable: true
});

Object.defineProperty(o, 'b', {
  // Using shorthand method names (ES2015 feature).
  // This is equivalent to:
  // get: function() { return bValue; },
  // set: function(newValue) { bValue = newValue; },
  get() { return bValue; },
  set(newValue) { bValue = newValue; },
  enumerable: true,
  configurable: true
});
o.b; // 38