风趣的JavaScript面向对象入门课程一
在我们程序猿界一直流传这这么一个joke,没女票我们可以new一个、没房子没票子没车子我们同样new一个!当然这听着更像是一种自嘲,毕竟我们程序猿都爱自嘲,哈哈,废话不多说,今天就由我带着你们来入JavaScript面向对象这个坑!千万别弃坑!
一、理解对象:
创建对象的两种方法:直接声明、Object的实例化
直接声明:
Var zhangsan = { Name : “zhangsan”, Age : 29, //创建一个introduce函数,用于返回张三的姓名 introduce.function(){ return zhangsan.name; } }
Object的实例化:
Var zhangsan = new Object(); zhangsan.name = “zhangsan”; zhangsan.age = 29; zhangsan.introduce = function(){ return zhangsan.name; };
调用方法:
Document.write(zhangsan.name+zhangsan.age);或者 Alert(zhangsan.introduce());
二、类的实现:
工厂生产对象:适用于当需要大规模输出对象时的问题
Function CreateCar(engine,tire){ Var car = new Object(); car.engine=engine; car.tire = tire; return car; }
调用工厂生产对象:
Var Audi = CreateCar(”four-engine”,”four-tire”);
生产出Audi一辆,即new了一个对象
说白了,工厂模式就是把创建对象的方法封装在函数中。
实际上,当你用instanceof运算符对实例Audi检测时:
Alert(Audi instanceof car);
结果会弹出对话框显示false。
即Audi不是car实例化出的对象!
三、构造函数
为解决上述问题特引入构造函数大佬
将以上的代码略作改写:
Function CreateCar(engine,tire){ this.engine=engine; this.tire=tire; this.drive = function(){ document.wirte(this.engine+this.tire); }; }
其实构造函数就是一个带this的普通函数,它不是大佬,哈哈!它里面的this就指通过这个构造函数生成一个新的对象。
虽说我们揭开了它大佬的面纱,但大佬还是大佬,它还是有用的..
Var Audi = new car(”four-engine”,”four-tire”); Alert(Audi instanceof car);
结果惊人的弹出显示:true
大佬果然是大佬!
但问题又来了,大佬也不是没有缺点,它的模式虽然好用,但是存在浪费内存的嫌疑,这就让大佬的声誉受到了严重的影响:
每一次生成一个person对象,都必须重新构建一遍sayName函数,真的麻烦!
铛,铛,铛!震惊 “全局函数” 出场竟然..
Function sayName(){ Document.write(this.name); }
然后再把person类中将sayName()指向外部的sayName()
this.sayName = sayName;
厉害了wold哥!
问题又来了,在全局变量中定义的函数只能被某个对象所调用,让这个函数有点名不副实的样子,而且当对象如果需要很多方法,就需要定义同样多的全局变量。这样对象的封装就毫无意义可言。这些问题我们都可以通过原型模式(Prototype)来解决。
原来一山更比一山高啊,这世外高人第一次见..
Person.prototype.sayName = function (){ document.write (this.name); };
与之前的:
Function sayName(){ Document.write(this.name); }
相比,第二个好low!
那么这位世外高人有什么用呢?
废话不多说上代码:
personA.sayName = function(){ document.write("personA:"+this.name+"<br/>"); }//对父对象中的方法进行复写,personA是person函数实例化出的一个新对象
哇!QAQ
本期的风趣的JavaScript面向对象课程就结束啦,谢谢大家的浏览和指正!我们下期再见!
风趣的JavaScript面向对象入门课程一的更多相关文章
- JavaScript面向对象入门
什么是JavaScript? 我们可以从几个方面去说JavaScript是什么: 基于对象 javaScript中内置了许多对象供我们使用[String.Date.Array]等等 javaScrip ...
- JavaScript面向对象轻松入门之封装(demo by ES5、ES6、TypeScript)
本章默认大家已经看过作者的前一篇文章 <JavaScript面向对象轻松入门之抽象> 为什么要封装? 封装(Encapsulation)就是把对象的内部属性和方法隐藏起来,外部代码访问该对 ...
- JavaScript面向对象轻松入门之概述(demo by ES5、ES6、TypeScript)
写在前面的话 这是一个JavaScript面向对象系列的文章,本篇文章主要讲概述,介绍面向对象,后面计划还会有5篇文章,讲抽象.封装.继承.多态,最后再来一个综合. 说实话,写JavaScript面向 ...
- JavaScript面向对象编程入门
来源极客网 function Person() { var _this = {} //创建一个空的对象,接着我们利用这个"空的对象"承载Person的属性和方法 _this.say ...
- JavaScript面向对象轻松入门之综合
javascrpit面向对象之综合 这一章是对前几章的一个总结,通过一个案例来综合认识javascript面向对象的基本用法 需求: 几乎所有的web应用都需要保存数据一些到本地,那么我们就来 ...
- JavaScript基础入门12 - 面向对象编程
目录 JavaScript 面向对象编程 前言 构造函数创建对象 instanceof constructor 返回值 原型对象 关于对象的属性查找 in hasOwnProperty() JS当中实 ...
- 《javascript面向对象精要》读书笔记
<javascript面向对象精要> 买这本书的原因主要是因为作者,Nicholas C. Zakas 牛X闪闪的js专家,读过js高程的应该都知道他,而这本书是他的最新力作,感觉也是js ...
- 快速学习JavaScript面向对象编程
到处都是属性.方法,代码极其难懂,天哪,我的程序员,你究竟在做什么?仔细看看这篇指南,让我们一起写出优雅的面向对象的JavaScript代码吧! 作为一个开发者,能否写出优雅的代码对于你的职业生涯至关 ...
- 第一百零九节,JavaScript面向对象与原型
JavaScript面向对象与原型 学习要点: 1.学习条件 2.创建对象 3.原型 4.继承 ECMAScript有两种开发模式:1.函数式(过程化),2.面向对象(OOP).面向对象的语言有一个标 ...
随机推荐
- Maven maven-compiler-plugin版本
项目执行Maven clean后出现WARNING提示.报如信息如下,根据报错信息 'build.plugins.plugin.version' for org.apache.maven.plugin ...
- js 中采用词法作用域
所谓的 词法( 代码 )作用域, 就是代码在编写过程中体现出来的作用范围. 代码一旦写好, 不用执行, 作用范围就已经确定好了. 这个就是所谓词法作用域. 在 js 中词法作用域规则: 1.函数允许访 ...
- setTimeout和setInterval不容易注意到的一些细节
今天没事翻了翻JS高程,看到了setTimeout部分有这么一句话:调用setTimeout()之后,该方法会返回一个数值ID,表示超时调用.这个超时调用ID是计划执行代码的唯一标识符,可以通过它来取 ...
- [js高手之路]Vue2.0基于vue-cli+webpack同级组件之间的通信教程
我们接着上文继续,本文我们讲解兄弟组件的通信,项目结构还是跟上文一样. 在src/assets目录下建立文件EventHandler.js,该文件的作用在于给同级组件之间传递事件 EventHandl ...
- three.js 文字显示不出来
试了下使用three.js加载文字,首先是报了一个这样的错误: Cross origin requests are only supported for HTTP.” 当时很懵逼,去网上查了查,发现是 ...
- xml字符串转对象xml文件转对象
判断是否是ie浏览器和非ie浏览器的方法有多种,在此只介绍用例中的方法: 1.解析xml字符串,得到xml对象的方式: function createXml(str){ if(document.all ...
- 字符编码笔记:ASCII,Unicode和UT…
字符编码笔记:ASCII,Unicode和UTF-8 今天中午,我突然想搞清楚Unicode和UTF-8之间的关系,于是就开始在网上查资料. 结果,这个问题比我想象的复杂,从午饭后一直看到晚上9点,才 ...
- 团队作业4----第一次项目冲刺(Alpha版本)4.25
a.提供当天站立式会议照片 会议内容: ①:对有的接口编写遇到的困难,由于基础问题,建议百度,谷歌现成的接口 ②:课程较多,时间不够,任务的调整以及进度的调整 b. 每个人的工作 每个人在尽量完成自己 ...
- C语言程序设计课程设计自查表格
课程设计自查表格 序号 项目 完成与否(完成打勾) 1 格式是否符合标准(缩进是否规范) 2 是否模块化设计(使用函数分解系统功能) 3 函数名否易懂(不得使用f1(int a1,int a2)这样的 ...
- 201521123058 java第六次作业
1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 2. 书面作业 1.clone方法 1.1 Object对 ...