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

本文主要是介绍前端学习之路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

这篇关于前端学习之路3-JavaScript面向对象的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---