js面向对象实例
JSON方式来编写对象
简单 不适合多个对象
var json={a:12,
show:function (){
alert(this);
}
};
json.show(); //理所当然弹出的是object(this指的是json)
call函数
function show(){
alert(this);
}
show();//window
show().call();//和上面的一样也是弹出window call()其实就是调用函数 但又和普通的函数调用有区别
show().call(12);//alert 12而不是'this'(window) 即call可以改变函数执行时的this function show(a,b){
alert('this是:'+this+'\na是:'+a+'\nb是:'+b);
}
show(12,5);//弹出window 12 5
show.call('abc',12,5);//只需把第一个参数变成this 后面的还是实参给形参
var arr1=[1,2,3];
var arr2=arr1;//这样也是引用 而不是单单的复制
//改变方法:
var arr3=[];
for(var i=0;i<arr.length;i++){
arr3.push(arr1[i]);
}
arr3.push(4);
对象由属性(变量)和方法(函数)构成
<script>
function A(){
this.abc=12;
}
A.prototype.show=function (){
alert(this.abc);
}
//继承A
function B(){
//这个this 是指的new B() 这是处在形参位置上的哇
A.call(this);
//call()其实就是调用函数 但又和普通的函数调用有区别即call可以改变函数执行时的this
//通过call来继承属性
}
B.prototype=A.prototype;//继承"方法" 原型这个也是引用!(c语言里的值传递啊引用传递啊) (下面改正)
B.prototype.fn=function (){
alert('abc');
} var objB=new B();
var objA=new A();
alert(obj.abc);//
obj.show();
objA.fn();//弹出了对象 按理来说A是没有这个方法的 但是call()这个是引用传递
</script>
//改正方法:
for(var i in A.prototype){
B.prototype[i]=A.prototype[i];
}
1.return false可以用来阻止默认事件即系统默认事件。例如通过阻止默认事件,来对textarea中的值进行范围限制(通过限制keycode的数值),
也可以自定义在页面中的右键菜单(oncontextmenu)。
(<textarea>标签定义及用法
在html中,<textarea>标签是用来定义一个多行的文本输入控件,在文本输入域中可以输入任意长度的文本。文本默认字体是等宽字体(Courier),可以通过css来改变。
在实际应用中,一般会通过cols属性和rows属性来设置textarea控件的尺寸大小(使用 css的height和width属性来设置更佳)。
cols 规定文本区域内可见的宽度 rows 规定文本区域内可见的行数。超行就上滚动条overflow <textarea style="overflow-x:hidden"></textarea>
)
2.在鼠标移动(mousemove)等事件中,是需要给事件传一个参数,保证程序的正常运行。而为了兼容取事件方法为:var oEvent=ev||event;
4、取消事件冒泡(不往父级传递): cancelBubble用于ie的阻止冒泡事件,event.stopPropagation()用于firefox和chrome等其他浏览器。
5、事件绑定:同一个事件加多次函数会被覆盖,而绑定不会。
IE方式:
attachEvent(‘’事件名‘’(前面加有on的),函数)绑定事件处理函数。
detachEvent(‘’事件名‘’(前面加有on的),函数)解除绑定。
DOM方式:
addEventListener(事件名称(没有on),函数,捕获(一般都为false))
aremoveEventListener(事件名称(没有on),函数,捕获(一般都为false))
可以同时加很多事件而不相互影响。并且可以封装为函数function(obj,ev,fn)
兼容如下:
if (obtn.attachEvent){IE}else{FF}.
事件捕获:setcapture()将事件都集中在一个地方,但是只有IE支持。
系统对象:
1.本地对象(非静态对象)(和环境无关)
什么是本地对象 (必须得new出来 得实例化之后才能用)
常用对象
Object、Function、Array、String、Boolean、Number、Date、RegExp、Error
2.内置对象(静态对象)(和环境无关)
(eg:Math.ceil() √ var obj=new Math() X 事实上Math只用他的类上的方法 )(不需要new出来 不需要实例化 直接就能拿来用的 叫静态对象)
Global、Math
3.宿主对象(由浏览器提供的对象)宿主:js运行环境(一般就是浏览器)
DOM、BOM
js面向对象实例的更多相关文章
- 第十五节 JS面向对象实例及高级
实例:面向对象的选项卡 把面向过程的程序,改写成面向对象的形式 原则:不能有函数套函数,但可以有全局变量 过程: onload —— 改写成 构造函数,其中window.onload的功能是在页面加载 ...
- js原生设计模式——3简单工厂模式\js面向对象编程实例
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- js面向对象学习 - 对象概念及创建对象
原文地址:js面向对象学习笔记 一.对象概念 对象是什么?对象是“无序属性的集合,其属性可以包括基本值,对象或者函数”.也就是一组名值对的无序集合. 对象的特性(不可直接访问),也就是属性包含两种,数 ...
- JS面向对象(2) -- this的使用,对象之间的赋值,for...in语句,delete使用,成员方法,json对象的使用,prototype的使用,原型继承与原型链
相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...
- JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式
相关链接: JS面向对象(1) -- 简介,入门,系统常用类,自定义类,constructor,typeof,instanceof,对象在内存中的表现形式 JS面向对象(2) -- this的使用,对 ...
- JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)
函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) { return i1 + i2;//如果不写return返回 ...
- 原生JS面向对象思想封装轮播图组件
原生JS面向对象思想封装轮播图组件 在前端页面开发过程中,页面中的轮播图特效很常见,因此我就想封装一个自己的原生JS的轮播图组件.有了这个需求就开始着手准备了,代码当然是以简洁为目标,轮播图的各个功能 ...
- js面向对象继承
前言 最近看到js面向对象这章节了,主要学习了原型和面向对象继承关系,为了梳理自己的知识逻辑,特此记录. js的面向对象 先说说我目前了解的js创建对象方法 1.写一个函数,然后通过new创建对象 2 ...
- JS面向对象笔记二
菜单导航,<JS面向对象笔记一>, 参考书籍:阮一峰之<JavaScript标准参考教程> 一.构造函数和new命令 二.this关键字 三.构造函数和new命令 四.构造函 ...
随机推荐
- ajax请求封装的公共方法
/** * post 方法 */ function ajaxPost(url, params, callBack) { ajax(url,params,"post",callBac ...
- j2cache笔记
初步理解 eg: https://my.oschina.net/javayou https://my.oschina.net/tinyframework/blog/538363?p=2 https:/ ...
- linux学习之软件包安装
本学习基于redhat系统或者centos系统 一.软件包的安装 1.rpm安装,rpm安装分为俩种,一种是直接安装xxx.rpm包,另一种是通过yum安装一系列的rpm包. #推荐使用yum安装,y ...
- SQL Server 函数之日期格式化函数
SQL Server 函数之日期格式化函数 高文龙关注0人评论612人阅读2017-09-23 13:47:07 SQL Server 函数之日期格式化函数 对于一些经常写SQL Server执行语句 ...
- 使用 Apache 来限制访问 Confluence 6 的管理员界面
限制特定的 IP 地址可以访问管理员后台 Confluence 的管理员控制台界面对整个应用来说是非常重要的,任何人访问 Confluence 的控制台不仅仅可以访问 Confluence 安装实例, ...
- Confluence 6 重构 ancestor 表
ancestor 表记录了上级和下级(子页面)页面之间的关系.这个表格同时被用来确定子页面是否具有从上级页面继承来的限制(restrictions)权限. 偶尔 ancestor 表格中的数据可能被损 ...
- Confluence 6 已经存在的安装配置数据库字符集编码
针对已经存在的 Confluence 安装,如果你安装的 Confluence 版本是 6.4 或者早期的版本,我们在安装的时候没有检查你数据库的字符设置. 如果你的数据库当前没有被配置使用 UTF- ...
- Confluence 6 CSS 编辑技巧
开始编辑空间样式表 一个空间的样式表是你开始对 CSS 进行自定义编辑的好的开始.在空间样式表中,包含了你所有可以进行修改的元素.当你对空间样式表进行编辑的时候,空间样式表的修改只会对你修改的空间有效 ...
- Django中各目录文件的作用
一般的项目结构如下(大同小异) my_site是一个项目,blog是项目下的应用之一,可以使用创建命令创建更多的应用. 最上层的django文件夹: 自己手动创建,名字随意. 第二层my_site文件 ...
- Altium Designer (17.0) 打印输出指定的层
Altium Designer (17.0) 例如,打印输出Top Overlay,Keep-Out Layer 1.先选择PCB文件,在单击按键Print Preview... 2.在预览区单击鼠标 ...