美文网首页
js面向对象

js面向对象

作者: 杨杨1314 | 来源:发表于2017-09-12 09:51 被阅读7次

JavaScript 是一门彻底的面向对象的语言。面向对象的概念:

1:一切事物皆对象

2:对象具有封装和继承特性

3:对象与对象之间使用消息通信,各自存在信息隐藏

面向对象的特点: 继承   封装   多态   抽象

一:封装

1:简单封装

生成实例对象的原始模式

这样写的缺点是:一是如果多生成几个实例,写起来就非常麻烦;二是实例与原型之间,没有任何办法,可以看出有什么联系。

2:原始模式

原始模式

这种方法,可以解决代码重复的问题。但是,cat1和cat2之间没有内在的联系,不能反映出它们是同一个原型对象的实例。

3:构造函数模式

所谓"构造函数",其实就是一个普通函数,但是内部使用了this变量。对构造函数使用new运算符,就能生成实例,并且this变量会绑定在实例对象上。

构造函数模式

这时cat1和cat2会自动含有一个constructor属性,指向它们的构造函数。所以,

console.log(dog1.constructor == dog) //true

console.log(dog2.constructor == dog) //true

4:prototype模式

               A:prototype 对象属性介绍:

prototype

             * prototype是js函数内设并且是自带的对象属性。prototype默认也有两个属性:                  constructor和__proto__。

             * constructor指的是oof对象的本身,而__proto__指的是Object.prototype。

            * prototype的作用是,当我们new一个函数的时候,prototype会用作new出来的这个对象                的原型。也就是__proto__,所以,可以给new出来的对象加属性赋值。

           * 当实例化这个函数的时候,oofobj就等于oof函数里面的this,所以,会返回 2 1

obj1 obj2 obj3 都在prototype属性上面

                 B:prototype模式使用:

prototype模式

               当用这种方式声明函数的时候,有一个很大的弊端。那就是对于每一个实例对象,                     type属性和eat()方法都是一模一样的内容,每一次生成一个实例,都必须为重复的内                   容,多占用一些内存。这样既不环保,也缺乏效率。所以,想让type属性和eat()方法在               内存中只生成一次。有一种方法就是用prototype属性。这意味着,我们可以把那些不                 变的属性和方法,直接定义在prototype对象上。也就是 :

prototype模式

              这时所有实例的type属性和eat()方法,其实都是同一个内存地址,指向prototype对                    象,因此就提高了运行效率。

二:继承

继承,顾名思义,子类集成父类的属性或者方法。怎样实现继承呢?下面将介绍构造函数的继承和非构造函数的继承。

1:构造函数的继承

A:第一种方法也是最简单的方法,使用call或apply方法,将父对象的构造函数绑定在子对象上,即在子对象构造函数中加一行:

call 或者 apply

call,apply方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

语法:call([thisObj[,arg1[, arg2[,  [,.argN]]]]])。

B:第一种方法是使用prototype属性。

prototype属性

将Cats的prototype对象指向一个animal的实例。当于完全删除了prototype 对象原先的值,然后赋予一个新值。

Cats.prototype.constructor是指向Cats的;加了Cats.prototype.constructor = Cats这一行以后,指向作用就是将Cats的prototype属性指回Cats。

C:直接继承prototype

直接继承prototype

将Cates的prototype对象,然后指向Animal的prototype对象,再用constryctor把属性指回Cates,这样就完成了继承。







person类 student 类和调用

说明:

B: student.prototype = Object.create(person.ptototype);Object.create的作用是创建一个空对象,这个对象的原型指向person.ptototype。那如果student.prototype = person.prototype; 这样的话,会导致给student增加属性的时候person也加上了该属性。

C:student.prototype.constructor = student; 这个constructor 的作用就是将student的prototype属性指回student. 

三:原型链

1:并不是所有的函数都有prototype属性的,例如:

当Object.create()里面为null的时候,他就没有prototype属性。

相关文章

  • JS面向对象精要(二)_函数

    JS面向对象精要(一)_原始类型和引用类型JS面向对象精要(二)_函数JS面向对象精要(三)_理解对象JS面向对象...

  • JS面向对象精要(三)_理解对象

    JS面向对象精要(一)_原始类型和引用类型JS面向对象精要(二)_函数JS面向对象精要(三)_理解对象JS面向对象...

  • JS面向对象精要(四)_构造函数和原型对象

    JS面向对象精要(一)_原始类型和引用类型JS面向对象精要(二)_函数JS面向对象精要(三)_理解对象JS面向对象...

  • JS面向对象精要(五)_继承

    JS面向对象精要(一)_原始类型和引用类型JS面向对象精要(二)_函数JS面向对象精要(三)_理解对象JS面向对象...

  • js 面向对象和面向过程

    js 面向对象和面向过程

  • 面向对象OOP--JS

    作者:烨竹 JS面向对象简介 JS名言:万物皆对象 JS面向对象比PHP简单很多;因为JS中没有class关键字,...

  • JavaScript笔记(一)

    一、面向对象面向过程的区别 1、什么是js对象 js对象:属性和方法的集合,js所有数据都可以看成对象...

  • JS面向对象

    JS面向对象入门 1、面向对象语言概念面向对象语言主要包括 类、对象、封装、多肽。2、面向对象的编程思想面向过程思...

  • 2018-01-18

    js中的面向对象核心 js是基于对象的编程语言,在后面的学习中我们通过一种模式使其转化成为面向对象的语言。js面向...

  • 浅谈JS中的面向对象

    浅谈JS中的面向对象 本文主要说说本人在JS中对面向对象的理解。 计算机编程语言主要分为面向过程式编程和面向对象式...

网友评论

      本文标题:js面向对象

      本文链接:https://www.haomeiwen.com/subject/rbggjxtx.html