JS原型和面向对象

1.原型 prototype和原型链_proto_

每个函数都会有一个prototype的属性并且可以共享的,而_proto_是一个对象的内置属性,每次实例化一个对象的时候,内部都会新建一个_proto_属性。

每个对象都有一个内部属性,这个内部属性的值可以是一个对象也可以是一个null,如果它的值是一个对象,那么这个对象还会有一个自己的原型,这样就

形成一条链,称为原型链。(原型链这有待于进一步学习,理解的还不是很透彻! )

示例:

控制台显示结果:

2.JS对象创建

(1)工厂模式:

工厂模式就是在函数中创建一个对象,然后给这个对象添加属性和方法然后返回该对象。但是每次都需要创建对象去调用方法,这样的话会很占内存。

创建对象:

调用:

输出结果为:

(2)构造函数模式:

注意:构造模式的函数首字母必须是大写,不用创建对象,用this指向属性和方法。构造模式的主要问题是每个方法都要在实例上重新创建一次

如下是构造函数模式:

 

   上面的this指向Person的一个对象,每个对象都会有一个go方法,会浪费资源。 

调用:

输出结果为:

(3)原型模式:

每个函数都有一个prototype属性,可以理解为指针,指向一个对象,而这个对象包含可以共享的属性和方法,再创建其他对象都是

可以共享这个原型对象的属性和方法,一旦这个原型的属性改变了,那么调用原型对象的那个对象也会随之改变,因此常与构造函数模型

一起使用。但是该方法避免了每个对象都创建函数。

先弹出的fsy23,紧接着弹出undefined ,因为this指向的是Person.prototype.go,里面没有name和age。so undefined。

(4)混合模式:

就是构造函数模式和原型模式的混合,支持传递初始参数,将所有属性定义在构造函数中,这种模式解决了传参和引用共享的难题。

示例:

输出结果为:

(5)动态原型模式:

将属性和方法都封装在了构造函数中,通过构造函数初始化原型原型,还有一个特点是可以通过判断该方法是否有效而选择是否初始化原型。

只弹出一次,但是控制台上都console出来,因为会先进行判断,符合就alert,只需要初始化一次。

时间: 2024-10-05 04:25:45

JS原型和面向对象的相关文章

简单粗暴地理解js原型链--js面向对象编程

简单粗暴地理解js原型链--js面向对象编程 原型链理解起来有点绕了,网上资料也是很多,每次晚上睡不着的时候总喜欢在网上找点原型链和闭包的文章看,效果极好. 不要纠结于那一堆术语了,那除了让你脑筋拧成麻花,真的不能帮你什么.简单粗暴点看原型链吧,想点与代码无关的事,比如人.妖以及人妖. 1)人是人他妈生的,妖是妖他妈生的.人和妖都是对象实例,而人他妈和妖他妈就是原型.原型也是对象,叫原型对象. 2)人他妈和人他爸啪啪啪能生出一堆人宝宝.妖他妈和妖他爸啪啪啪能生出一堆妖宝宝,啪啪啪就是构造函数,俗

JavaScript面向对象(二)——成员属性、静态属性、原型属性与JS原型链

前  言 上一篇博客(https://www.cnblogs.com/qdjianghao/p/10177360.html )中,我们介绍了JS中的面向对象,并详细的解释了this的指向问题.本篇博客,我们继续来学习JS的面向对象.来深入理解一下JavaScript OOP中的成员属性/方法.静态属性/方法.原型属性/方法,并且一起来探讨一下JS中的原型与原型链. 一 成员属性与成员方法 在构造函数中,通过this.属性声明.或者实例化出对象后,通过"对象.属性"追加的.都属于成员属性

js原型对象与Java类的区别

在我学习Javascript的原型对象时,我总是不自觉地拿Java的类思想来做比较,时间久了,我渐渐认识到二者有巨大的不同. 首先,类是不能直接当方法来运行,它最简便的方式是调用其静态方法:而原型对象本身就是一个方法体,它可以直接运行.二者在构造对象的过程中,js可以扮演两种角色,一个可以将原型对象当方法来使用,才接触js时,都是以这种形式来使用,即万物皆方法体,像c;另一个是模仿面向对象的特性,为原型对象定义属性,运用构造器时,将构造器构造的对象的指针指通过原型链指向原型对象的属性,从而实现面

js中的面向对象

面向对象:不了解原理的情况下,会使用功能.如:电视机,不清楚原理,却知道如何操作.面向对象是一种通用的思想,并非只有在编程使用.面向对象编程简称OOP. js是一个基于原型的面向对象的编程语言,即每个对象有一个原型对象,对象从原型中继承属性和方法. js的原型的关系是递归的.即,对象的原型也是一个对象,而原型的本身可能还有一个原型. js中的对象使用一个new 运算符和一个构造函数来创建 js中可以给对象动态的添加属性和方法 js中创建对象的方法有多种,包括:原型方式,动态原型方式,工厂方式等等

深刻理解JavaScript基于原型的面向对象

主题一.原型 一.基于原型的语言的特点 1 只有对象,没有类;对象继承对象,而不是类继承类. 2  "原型对象"是基于原型语言的核心概念.原型对象是新对象的模板,它将自身的属性共享给新对象.一个对象不但可以享有自己创建时和运行时定义的属性,而且可以享有原型对象的属性. 3 除了语言原生的顶级对象,每一个对象都有自己的原型对象,所有对象构成一个树状的层级系统.root节点的顶层对象是一个语言原生的对象,其他所有对象都直接或间接继承它的属性. 显然,基于原型的语言比基于类的语言简单得多,我

深入理解JS原型链与继承

我 觉得阅读精彩的文章是提升自己最快的方法,而且我发现人在不同阶段看待同样的东西都会有不同的收获,有一天你看到一本好书或者好的文章,请记得收藏起来, 隔断时间再去看看,我想应该会有很大的收获.其实今天要讨论的主题,有许多人写过许多精彩的文章,但是今天我还是想把自己的理解的知识记录下来.我在学习 掌握JS原型链和继承的时候,就是看得@阮一峰老师的写的文章,觉得他写的技术类的文章都容易让理解,简明概要,又好理解.他是我学习JS路程里面一个比较佩服的导师,昨天重新看了他写的<Javascript 面向

谈谈JS中的面向对象

请先看看下面这段代 1 <script src="jquery.js"></script> 2 <script type="text/javascript"> 3 /** 4 * Object.create() 最近才添加进了ECMAScript第5版规范,有些浏览器不支持 5 * 这里模拟一个Object.create方法解决兼容性问题 6 * Object.create : 该方法只有一个参数,即原型对象,返回一个新对象 7

37.浅谈js原型的理解

浅谈Js原型的理解 一.js中的原型毫无疑问一个难点,学习如果不深入很容易就晕了!    在参考了多方面的资料后,发现解释都太过专业,对于很多还没有接触过面向对象    语言的小白来说,有理解不了里面的专有名词!如果你没学过c++或者Java之类的更接触底层的语言,那就不要太深究,理解会用自然可以了,当接触到更多语言时慢慢的会理解越来越深刻! 下面我就举例分享一下prototype的概念!知道对于初学者知道这些就足够了! 分析一下,上面这个例子!我们可以知道 People的类型是一个对象!按照j

js原型链继承的傻瓜式详解

本文争取用最简单的语言来讲解原型链继承的OOP原理 0.如果对原型继承还没有大致了解,完全一头雾水,请先阅读 <JavaScript高级程序设计>第六章最后部分的寄生组合式继承 或者_廖雪峰js教程里面面向对象部分的原型承部分https://www.liaoxuefeng.com/wiki/001434446689867b27157e896e74d51a89c25cc8b43bdb3000/0014344997013405abfb7f0e1904a04ba6898a384b1e925000 1