js面向对象编程的一些笔记-自学php网

js面向对象编程的一些笔记

来源：自学PHP网时间：2014-09-19 14:47 作者：阅读:次

[导读] js面向对象编程的一些笔记，在js中面向对象有点像java或c++中的一样了，下面我来给大家整理一些js面向对象编程的一些笔记，希望对大家会有所帮助。...

在很多后台语言如c++,java,php等都是面向对象的编程语言，js当中，面向对象是不够完善的，虽然js当中有很多对象，但是面向对象不能和对象划等号，所以今天小编给大家具体讲解一下js当中的面向对象

一.什么叫面向对象

简单的说，面向对象有三大特征：封装，继承，多态

1、封装：把相关的信息（无论数据还是方法）存储在对象的能力
2、继承：由另一个类（或多个类）得来的属性和方法的能力
3、多态：编写能以多种方法运行的函数或方法的能力

二.面向对象的优点

1、易维护
采用面向对象思想设计的结构，可读性高，由于继承的存在，即使改变需求，那么维护也只是在局部模块，所以维护起来是非常方便和较低成本的。
2、质量高
在设计时，可重用现有的，在以前的项目的领域中已被测试过的类使系统满足业务需求并具有较高的质量。
3、效率高
在软件开发时，根据设计的需要对现实世界的事物进行抽象，产生类。使用这样的方法解决问题，接近于日常生活和自然的思考方式，势必提高软件开发的效率和质量。
4、易扩展
由于继承、封装、多态的特性，自然设计出高内聚、低耦合的系统结构，使得系统更灵活、更容易扩展，而且成本较低。

三.js当中面向对象的写法

1.工厂方式

代码如下	复制代码
function createPerson(name,age) { var person=new object(); person.name=name; person.age=age; person.showPerson=function() { alert(“我叫”+this.name+”,我今年”+this.age+”岁”); } } var p1=createPerson(“huanghao”,23); p1.showPerson();//我叫huanghao，我今年23岁

2.构造函数的方式

代码如下	复制代码
function createPerson(name,age) { this.name=name; this.age=age; this.showPerson=function() { alert(“我叫”+this.name+”,我今年”+this.age+”岁”); } } var p1=new createPerson(“huanghao”,23); p1.showPerson();

注意：前两种方式有弊端，就是每次new一次，都会重新建立自己的函数，假设我又新建一个var p2=new createPerson(“xiaotian”,20);接着我们弹一下alert(p1.showPerson===p2.showPerson),惊奇的发现结果为false,这也就意味这两次new出来的对象的showPerson方法不是同一个方法，所以原型方式就应运而生

3.原型方式/构造与原型方式混合

代码如下	复制代码
function createPerson(name,age) { this.name=name; this.age=age; } createPerson.prototype.showPerson=function() { alert(“我叫”+this.name+”,我今年”+this.age+”岁”); } var p1=new createPerson(“huanghao”,23); p1.showPerson();

同样是再创建一个var p2=new createPerson(“blue”,33); alert(p1.showPerson===p2.showPerson)//true

上面这种方式属于原型与构造函数混合的方式，也是我们在js面向对象时经常使用的方式，这种方式的写法是，将属性写在构造函数里，方法写在prototype里

四,js面向对象中的this指向问题

js面向对象通常会让人疑惑的地方就是this指向问题，在小编的经验看来，通常情况下会有两个地方在this指向问题出错，第一个是运用定时器的时候，第二就是给对象加事件的时候，因此需要特别注意

小结：以上就是js忠的面向对象，运用第三种方法可以完善的模拟出主流编程语言的面向对象，而且在很多面试当中都要问到的问题，

js中offsetLeft,offsetTop,offsetParent详解

js 通过class获取元素实例小结

子栏目

js面向对象编程的一些笔记

最新评论

添加评论

更多文章推荐

添加评论