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命令 四.构造函 ...
随机推荐
- PID控制器开发笔记之六:不完全微分PID控制器的实现
从PID控制的基本原理我们知道,微分信号的引入可改善系统的动态特性,但也存在一个问题,那就是容易引进高频干扰,在偏差扰动突变时尤其显出微分项的不足.为了解决这个问题人们引入低通滤波方式来解决这一问题. ...
- GitHub访问慢
问题描述 一直都觉得访问 GitHub 时速度非常慢,刷新一下都要等好久!于是尝试一下能否解决掉... github.com assets-cdn.github.com avatar2.githubu ...
- ssh 登录报错 packet_write_wait: Connection to x.x.x.x port 22: Broken pipe
问题 更新个人博客文章时遇到:Error: packet_write_wait: Connection to 192.30.253.113 port 22: Broken pipe packet_wr ...
- python 与mongodb 交互
创建管理员 1 > use admin 2 switched to db admin 3 > db 4 admin 5 > db.createUser({user:'admin',p ...
- 用ngif 多次判断 Expression has changed after it was checked
昨天遇到一个问题 ,用ng Expression has changed after it was checked 查了一下说在angular2中,这个错误只会在dev开发模式下出现,在pro发布版本 ...
- cf1140E 回文串+染色方案dp
有点硬核的dp..要用到一个结论.. /* 把原串拆成奇偶串,再拆成极大连续的-1串:该串两端都是非-1数,中间都是-1,并且下标要么都是偶数,要么都是技术 然后对所有这些串进行dp,dp[i][0] ...
- vue 中样式的绑定
1.class的对象绑定 //对应的css <style> .active { color: red; } </style> <!--html 对应的代码--> & ...
- Coding配合git使用时遇到的问题
转载整理: https://www.jianshu.com/p/b23cd00cffa6 https://www.cnblogs.com/yidoucai/p/5228763.html https:/ ...
- AI-URL注册器
官方文档地址:https://www.django-rest-framework.org/tutorial/quickstart/#serializers #url生成器生成四个url,就可以访问关于 ...
- python编程实现十进制的转换(十进制到任何进制不用系统函数实现)
# 用户给定一个十进制数据,以及进制n, 完成n进制的转换,输出结果给用户(不要借助已有函数) # 用户的输入进制数据Decdata = int(input("请输入一个十进制数据:&quo ...