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命令 四.构造函 ...
随机推荐
- 将list集合转json
public static class DataHelper { /// /// js 序列化器 /// static JavaScriptSerializer jss = new JavaScrip ...
- Win10 SQL Server 2017安装教程
Win10 SQL Server 2017安装教程 1:下载地址 2:开始安装 1:安装环境预备说明 还要注意就是要先下载这个VC++的更新,可以解决服务器安装不上的问题,下载链接 :Microsof ...
- 彻底完全卸载 SQL Server 2005 的图文教程
彻底完全卸载 SQL Server 2005 的图文教程 SQL SERVER 2005不象SERVER 2000所有组件都汇总在一起,所以卸载时特别麻烦,如果不按正常的方法卸载,重新安装是不可能安装 ...
- linux命令中的参数前的一横(-)和两横(--)的区别
在解释这些区别之前我们先了解一下有关linux的背景知识,这个需要大家先认真看完就会对这些区别有更深入的了解,对linux也有更深的了解. 关于System V和BSD风格以及他们与Linux的关系: ...
- SpringBoot事务管理
1.在UserMapper接口中添加更新和删除方法 package com.cppdy.mapper; import org.apache.ibatis.annotations.Delete; imp ...
- 【linux】Linux误删C基本运行库libc.so.6急救方法
转自:http://www.cnblogs.com/fjping0606/p/4551475.html 下面全文都是拷贝的上面链接的内容. 首先普及一下关于libc.so.6的基本常识: libc.s ...
- laravel 中CSS 预编译语言 Sass 快速入门教程
CSS 预编译语言概述 CSS 作为一门样式语言,语法简单,易于上手,但是由于不具备常规编程语言提供的变量.函数.继承等机制,因此很容易写出大量没有逻辑.难以复用和扩展的代码,在日常开发使用中,如果没 ...
- less 写关键帧动画
@keyframes 关键帧动画写在less里的时候,务必要写在所有的{}之外,不能被{}包裹 甚至务必写在代码的最后 不然报错 Compilation resulted in incorrect C ...
- 常见的爬虫分析库(1)-Python3中Urllib库基本使用
原文来自:https://www.cnblogs.com/0bug/p/8893677.html 什么是Urllib? Python内置的HTTP请求库 urllib.request ...
- K/3 Cloud Web API接口说明文
K/3 Cloud Web API接口说明文 目的 三方集成,提供第三方系统与Cloud集成调用接口. 技术实现 HTTP + Json 提供标准接口 编号 名称 说明 1 Kingdee.BOS.W ...