JS高级 - 面向对象1(this,Object ,工厂方式,new )
面向对象三要素:
封装
继承
多态
1.this 详解,事件处理中this的本质
- window
- this —— 函数属于谁
<script type="text/javascript">
var arr=[12,65,87];
//this:当前的方法,属于谁
arr.show =function (argument) {
// body...
console.log(this); //[12,65,87]
}
arr.show();
function show(){
console.log(this); //window
}
show();
</script>
2.Object 的使用:##
<script type="text/javascript">
var obj = new Object();
obj.aaa = 12;
obj.show = function (argument) {
console.log(this.aaa); //12
}
obj.show();
</script>
3.工厂方式:
<script type="text/javascript">
function createPerson(name, sex) {
var obj = new Object();
obj._name = name;
obj._sex = sex;
obj.showName = function() {
console.log('我的名字叫:' + this._name);
}
obj.showSex = function() {
console.log('我是' + this._sex + '的');
}
return obj;
}
var p1 = createPerson('唐三', '男');
p1.showName();
p1.showSex();
var p2 = createPerson('唐九妹', '女');
p2.showName();
p2.showSex();
</script>
工厂方式的问题:
1.没有new
2.每个对象都有一套自己的函数 —— 浪费资源
4.new的情况:
<script type="text/javascript">
function createPerson(name, sex) {
//var this = Object();
this._name = name;
this._sex = sex;
this.showName = function() {
console.log('我的名字叫:' + this._name);
}
this.showSex = function() {
console.log('我是' + this._sex + '的');
}
//return this;
}
var p1 = new createPerson('唐三', '男'); //new 的情况下
p1.showName();
p1.showSex();
var p2 = new createPerson('唐九妹', '女');
p2.showName();
p2.showSex();
</script>
JS高级 - 面向对象1(this,Object ,工厂方式,new )的更多相关文章
- js高级-面向对象继承
一.工厂模式创建对象及优缺点 继承就是把公共的部分抽象出来作为父类,基类.吃饭,跑步等 var a = {}; //批量创建不方便,不能重复设置公共属性的代码 //工厂模式出现了,创建10个Cat对象 ...
- js中面向对象(创建对象的几种方式)
1.面向对象编程(OOP)的特点: 抽象:抓住核心问题 封装:只能通过对象来访问方法 继承:从已有的对象下继承出新的对象 多态:多对象的不同形态 一.创建对象的几种方式 javascript 创建对象 ...
- JS高级——面向对象方式解决歌曲管理问题
需要注意的问题: 1.其他模块若是使用构造函数MP3创建对象,唯一不同的就是他们传入的音乐库是不一样的,所以构造函数中存在一个songList属性,其他一样的就被添加到了构造函数的原型对象之中 2.原 ...
- JS高级 - 面向对象4(json方式面向对象)
把方法包在一个Json里 var p1 = { name: "唐三", sex: "男", dreamdu: { URL: "www.dreamdu. ...
- JS高级——面向对象方式解决tab栏切换问题
注意事项 1.给li元素注册事件,函数里面的this指的li元素,那么我们可以在注册事件之前将Tab对象用that=this进行保存 2.使用沙箱模式,所以暴露给外面的变量使用的是window.tab ...
- JS高级 - 面向对象5(继承,引用)
<script type="text/javascript"> //------------------Person类 //(Person)的构造函数 function ...
- JS高级 - 面向对象2(prototype定义)
定义和用法 prototype 属性允许您向对象添加属性和方法 注意: Prototype 是全局属性,适用于所有的Javascript对象. 语法 object.prototype.name=val ...
- JS高级---面向对象的编程思想(贪吃蛇梳理)
面向对象的编程思想(贪吃蛇梳理) 模拟贪吃蛇游戏,做的项目 地图: 宽,高,背景颜色,因为小蛇和食物都是相对于地图显示的, 这里小蛇和食物都是地图的子元素, 随机位置显示, 脱离文档流的, 地图也需要 ...
- JS高级 - 面向对象3(面向过程改写面向对象)
改写: 1.前提:所有东西都在 onload 里 2.改写:不能有函数嵌套,可以有全局变量 onload --> 构造函数 全局变量 --> 属性 函数 --> 方法 4.改错: t ...
随机推荐
- JAVA记录-SpringMVC国际化配置
1.搭建SpringMVC框架,不过多阐述 2.spring-mvc.xml加入以下配置: <!-- 国际化资源配置,资源文件绑定器--> <bean id="messag ...
- Codeforces 219D - Choosing Capital for Treeland(树形dp)
http://codeforces.com/problemset/problem/219/D 题意 给一颗树但边是单向边,求至少旋转多少条单向边的方向,可以使得树上有一点可以到达树上任意一点,若有多个 ...
- PHP7 学习笔记(五)安装event扩展(libevent)
一.描述:有效安排I/O,时间和信号的扩展 使用可用于特定平台的最佳I/O通知机制的事件,是PHP基础设施的libevent端口. 二.下载地址:http://pecl.php.net/package ...
- C++常量 运算符
\n 换行 光标移到下一行 \0 空值 \t 水平制表符 \r 回车 光标回到本行开头 ...
- assistant文档
资料 https://blog.csdn.net/La_vie_est_belle/article/details/82662937 contents 内容 signals 信号 Detai ...
- 在浏览器中使用Javascript
在浏览器中点击鼠标右键——检查,选择console,可以在里面写Javascript代码,并可以在页面实时看到结果: 关于JavaScript的几个注意事项: JavaScript 语句和 JavaS ...
- css命名规范: BEM 的命名法
整理自:前端早读课[第1183期]这些 CSS 命名规范,将省下你大把调试时间 试图解决 3 类问题: 仅从名字就能知道一个 CSS 选择器具体做什么 从名字能大致清楚一个选择器可以在哪里使用 从 C ...
- python3中的比较函数
在py2中,比较函数是cmp,而在py3,cmp已经不存在了,Py3启用了新的比较方法 原来在py2中,a>b就会调用a对象中的__cmp__函数,而现在a>b会调用a对象中的__lt__ ...
- keepalived高可用系列~通用基础
简介:今天咱们来聊聊keepalived一 keepalived 架构 1 标准架构: keepalived+lvs/haproxy+后端 real server(mysql从库,nginx.myc ...
- python - class类 (五) 继承补充-子类继承父类属性/函数方法
子类继承父类属性/函数方法: #方式一:(原生方式,不建议使用) class Dongwu(object): def __init__(self,name,sex,old): self.name = ...