JavaScript - 对象
1.对象(Object)或实例(instance):在JavaScript中,对象则是数据与程序代码的组合,它可以是整个应用程序或整个应用程序的一部分。
2.属性(property)或字段(filed):是用来描述对象的特质。
3.方法(method):是用来执行对象的动作。
4.事件(event):是在某些情况下发出特定信号警告。
5.类(class):是对象的分类,就像对象的蓝图,隶属于相同类的对象具有相同 的属性,方法与事件,但属性的值则不一定相同。
6.window对象包括以下三类子对象:
(1)核心对象:Array,Boolean,Date,Error,Function,Global,Math,Number,Object,RegExp,String等对象;
(2)环境对象:可以通过环境对象访问浏览器或用户屏幕的信息,包括location,screen,navigator,history等对象;
(3)document对象:这个对象代表的是HTML文件本身,可以通过它访问HTML文件的元素,包括窗体,图片,表格,超链接等。
1.window对象
window对象代表一个浏览器窗口(window),索引标签(tab)或框架(frame)。
2.核心对象
2.1Number
window.document.write(Number.MAX_VALUE + "<br>");
window.document.write(Number.MIN_VALUE + "<br>");
window.document.write(Number.NaN + "<BR>");
window.document.write(Number.NEGATIVE_INFINITY + "<br>");
window.document.write(Number.POSITIVE_INFINITY + "<br>");
var X = new Number(123.456);
window.document.write(X + "转换为科学表示法得到" + X.toExponential() + "<br>");
window.document.write(X + "取到小数点后面二位得到" + X.toFixed(2) + "<br>");
window.document.write(X + "转换为字符串得到" + X.toString() + "<br>");
window.document.write(X + "设定为8位精确位数得到" + X.toPrecision(8) + "<br>");
window.document.write(X + "取值得到" + X.valueOf() + "<br>");
2.2Boolean
当以第一种方式简历布尔类型的变量时,只有在参数为false,0,null,undefined的情况下,会得到值为false的变量。
var X=new Boolean(false);
var X=false;
2.3String
var X="Java Script!";
charAt(index);
charCodeAt(index);
indexOf(str,start);
lastIndexOf(str);
match(str);
search(str);
concat(str);
replace(str1,str2);
split(str);
substr(index,length);
substring(i1,i2);
toLowerCase();
toUpperCase();
String对象也提供了如下表的格式编排方法,可以将字符串输出为对应的HTML元素。
var X = new String("JavaScript程序设计");
window.document.write("anchor(): " + X.anchor() + "<br>");
window.document.write("big(): " + X.big() + "<br>");
window.document.write("blink(): " + X.blink() + "<br>");
window.document.write("bold(): " + X.bold() + "<br>");
window.document.write("fixed(): " + X.fixed() + "<br>");
window.document.write("fontcolor('red'): " + X.fontcolor("red") + "<br>");
window.document.write("fontsize(7): " + X.fontsize(7) + "<br>");
window.document.write("italics(): " + X.italics() + "<br>");
window.document.write("link('http://www.baidu.com'): " +
X.link("http://www.baidu.com") + "<br>");
window.document.write("small(): " + X.small() + "<br>");
window.document.write("strike(): " + X.strike() + "<br>");
window.document.write("sub(): " + X.sub() + "<br>");
window.document.write("sup(): " + X.sup() + "<br>");
2.4Function
var Sum=new Function("X","Y","return(X+Y)");
2.5Object
var objEmployee =new Object();
objEmployee.Name="小丸子";
objEmployee.Age=25;
2.6Math
window.document.write("E的值为" + Math.E + "<br>");
window.document.write("LN2的值为" + Math.LN2 + "<br>");
window.document.write("LN10的值为" + Math.LN10 + "<br>");
window.document.write("LOG2E的值为" + Math.LOG2E + "<br>");
window.document.write("LOG10E的值为" + Math.LOG10E + "<br>");
window.document.write("PI的值为" + Math.PI + "<BR>");
window.document.write("SQRT1_2的值为" + Math.SQRT1_2 + "<br>");
window.document.write("SQRT2的值为" + Math.SQRT2 + "<br>");
window.document.write("-100的绝对值为" + Math.abs(-100) + "<br>");
window.document.write("5和25的较大值为" + Math.max(5,25) + "<br>");
window.document.write("5和25的较小值为" + Math.min(5,25) + "<br>");
window.document.write("2的10次方为" + Math.pow(2,10) + "<br>");
window.document.write("1.56的四舍五入值为" + Math.round(1.56) + "<br>");
window.document.write("2的平方根为" + Math.sqrt(2) + "<br>");
2.7Date
获取日期信息
//建立一个名称为objDate的Date对象,默认值为系统目前日期时间
var objDate = new Date();
//在浏览器显示objDate对象的值
document.write("目前日期时间为" + objDate + "<br>");
//调用Date对象的方法并显示结果
document.write("getDate()的返回值为" + objDate.getDate() + "<br>");
document.write("getDay()的返回值为" + objDate.getDay() + "<br>");
document.write("getMonth()的返回值为" + objDate.getMonth() + "<br>");
document.write("getYear()的返回值为" + objDate.getYear() + "<br>");
document.write("getFullYear()的返回值为" + objDate.getFullYear() + "<br>");
document.write("getHours()的返回值为" + objDate.getHours() + "<br>");
document.write("getMinutes()的返回值为" + objDate.getMinutes() + "<br>");
document.write("getSeconds()的返回值为" + objDate.getSeconds() + "<br>");
document.write("getMilliseconds()的返回值为" + objDate.getMilliseconds() + "<br>");
document.write("getTime()的返回值为" + objDate.getTime() + "<br>");
设置日期信息
var objDate = new Date(); //建立一个名称为objDate的Date对象
objDate.setDate(14); //将日期设置为14日
objDate.setMonth(1); //将月份设置为2月
objDate.setYear(2015); //将年份设置为2015年
objDate.setHours(12); //将小时设置为12点
objDate.setMinutes(10); //将分钟设置为10分
objDate.setSeconds(25); //将秒数设置为25秒
document.write("我们设置的日期时间为" + objDate + "<br>");
2.8Array
定义
//定义1
var UserNames=new Array(5);
UserNames[0]="小丸子";
UserNames[1]="花轮";
UserNames[2]="小玉";
UserNames[3]="美环";
UserNames[4]="丸尾";
//定义2
var UserNames=new Array("小丸子","花轮","小玉","美环","丸尾");
//定义3
var UserNames=["小丸子","花轮","小玉","美环","丸尾"];
多维数组
var Students = new Array(5);
for(var i = 0; i < Students.length; i++)
Students[i] = new Array(2);//声明Array对象的元素为另一个Array对象
Students[0][0] = "小丸子"; //一一给二维数组赋值
Students[1][0] = "花轮";
Students[2][0] = "小玉";
Students[3][0] = "美环";
Students[4][0] = "丸尾";
Students[0][1] = 80;
Students[1][1] = 95;
Students[2][1] = 92;
Students[3][1] = 88;
Students[4][1] = 85;
for(var i = 0; i < Students.length; i++)//使用嵌套循环显示二维数组的值
{
document.write("<tr>");
for(var j = 0; j < Students[i].length; j++)
document.write("<td>" + Students[i][j] + "</td>");
document.write("</tr>");
}
Array对象的方法
//concat(arr)——数组合并
var Arr1 = new Array("a", "b", "c");
var Arr2 = new Array("d", "e");
var Arr3 = Arr1.concat(Arr2);
for(var i = 0; i < Arr3.length; i++)
document.write(Arr3[i] + "<br>");
//join(str)——使用str连接元素
var Arr = new Array("a", "b", "c");
var Result = Arr.join("--");
document.write(Result);
//pop()——删除最后一个元素
var Arr = new Array("a", "b", "c");
var Result = Arr.pop();
document.write(Result);
//push(data)——添加元素
var Arr = new Array("a", "b", "c");
Arr.push("d");
for(var i = 0; i < Arr.length; i++)
document.write(Arr[i] + "<br>");
//shift()——删除第一个元素
var Arr = new Array("a", "b", "c");
var Result = Arr.shift();
document.write(Result);
//unshift(data)——将data加入数组的前端
var Arr = new Array("a", "b", "c");
Arr.unshift("d");
for(var i = 0; i < Arr.length; i++)
document.write(Arr[i] + "<br>");
//reverse() 反转
var Arr = new Array("a", "b", "c");
Arr.reverse();
for(var i = 0; i < Arr.length; i++)
document.write(Arr[i] + "<br>");
//slice(start,end),返回下标start到下标end-1之间元素所形成的新数组
var Arr1 = new Array("a", "b", "c", "d", "e");
var Arr2 = Arr1.slice(1, 3);
for(var i = 0; i < Arr2.length; i++)
document.write(Arr2[i] + "<br>");
//sort()--排序,由小到大
var Arr = new Array(50, 40, 80, 90, 60);
Arr.sort();
for(var i = 0; i < Arr.length; i++)
document.write(Arr[i] + "<br>");
//toString()
var Arr = new Array("a", "b", "c");
var Result = Arr.toString();
document.write(Result);
Array作为参数
var Data1 = new Array(1, 2, 3, 4, 5);
var Data2 = new Array(10, 20, 30, 40, 50);
var Data3 = ArrAdd(Data1, Data2);
//在浏览器显示数组Data3的元素
for(var i = 0; i < Data3.length; i++)
document.write(Data3[i] + "<br>");
//声明一个名称为ArrAdd、有两个数组参数的函数
function ArrAdd(Arr1, Arr2)
{
var Arr3 = new Array();
for(var i = 0; i < Arr1.length; i++)
Arr3[i] = Arr1[i] + Arr2[i];
return Arr3;
}
2.9Error
var X = 100;
try //错误处理的开头
{
X = Y; //Y 未被定义将导致此程序语句发生错误
}
catch(e) //捕捉到Error对象e
{
document.write("捕捉到的Error对象错误码为" + e.number + "<br>");
document.write("捕捉到的Error对象错误信息为" + e.message + "<br>");
document.write("捕捉到的Error对象错误描述为" + e.description + "<br>");
}
finally //finally区块的程序代码一定会执行
{
document.write("X的值为" + X);
} //错误处理的结尾
3.环境对象
3.1loacation对象
location对象包括目前开启之网页的网址信息(URI),可以通过该对象获取或控制浏览器的网址,重载网页或导向其他网页。<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>范例</title>
<script language="javascript">
for(var Property in window.location)
window.document.write(Property + ":" + window.location[Property] + "<br>");
</script>
</head>
<body>
<input type="button" value="重载"
onclick="javascript:window.location.reload();">
<input type="button" value="导向到百度网站"
onclick="javascript:window.location.replace('http://www.baidu.com');">
</body>
</html>
3.2screen对象
用户的屏幕信息。
window.document.write("height属性的值为" + screen.height + "<br>");
3.3navigator对象
window.document.write("width属性的值为" + screen.width + "<br>");
window.document.write("availHeight属性的值为" + screen.availHeight + "<br>");
window.document.write("availWidth属性的值为" + screen.availWidth + "<br>");
window.document.write("colorDepth属性的值为" + screen.colorDepth + "<br>");<!doctype html
<html>
<head>
<meta charset="utf-8">
<title>范例</title>
<script language="javascript">
for(var Property in window.navigator)
window.document.write(Property + ":" + window.navigator[Property] + "<br>");
</script>
</head>
</html>
3.4history对象
history对象包含浏览器的浏览历程记录。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>范例</title>
<script language="javascript">
for(var Property in window.history)
window.document.write(Property + ":" + window.history[Property] + "<br>");
</script>
</head>
<body>
<input type="button" value="上一页" onclick="javascript:window.history.back();">
<input type="button" value="下一页" onclick="javascript:window.history.forward();">
</body>
</html>
4.document对象
4.1新标签
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>范例</title>
<script language="javascript">
function openDocument()
{
var NewWin = window.open("", "NewWin");//开启新的浏览器
NewWin.document.open("text/html");//在另一个浏览器开启新文件
NewWin.document.write("这是新的HTML文件"); //在新文件中显示此字符串
NewWin.document.close();//关闭新文件数据流
}
</script>
</head>
<body>
<input type="button" value="开启新文件" onclick="javascript:openDocument();">
</body>
</html>
4.2几个方法
<input type="checkbox" name="phone" id="CB1" value="hTC">
<input type="checkbox" name="phone" id="CB2" value="Apple">
<input type="checkbox" name="phone" id="CB3" value="ASUS">
var Element1=document.getElementById("CB1");
var Element2=document.getElementsByName("phone");
var Element3=document.getElementByTagName("input");
4.3document的子对象body
有属性:
link;alink;vlink;background;bgColor,text;
document.body.bgColor="yellow";
有集合:
all;anchors;links;forms;frames;Images;styleSheets;embeds;applets;plugins;
<form name="myForm1">
<input type="button" id="B1" value="按钮1">
<input type="button" id="B2" value="按钮2">
</form>
<form name="myForm2">
<input type="button" id="B3" value="按钮3">
<input type="button" id="B4" value="按钮4">
</form>
document.forms[0].B1.value;//获取值
document.forms.myForms1.B1.value;
document.forms[1].B3.value;
document.forms.myForms2.B3.value;
5.element对象
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>范例</title>
<script language="javascript">
function showMsg()
{
var msg = document.getElementById("message");
msg.innerHTML = "Hello World!";
}
</script>
</head>
<body>
<input type="button" value="显示信息" onclick="javascript:showMsg();">
<p id="message"></p>
</body>
</html>
JavaScript - 对象的更多相关文章
- json与JavaScript对象互换
1,json字符串转化为JavaScript对象: 方法:JSON.parse(string) eg:var account = '{"name":"jaytan&quo ...
- javaScript对象-基本包装类型的详解
本人按书上的内容大致地把javaScript对象划分成“引用类型”.“基本包装类型”和“内置对象”三块内容. 我们这篇先了解下基本包装类型的详细用法吧! 一.我们先解下相关概念: 1.引用类型的值(对 ...
- 如何理解javaScript对象?
在我们生活中,常常会提到对象一词,如:你找到对象了吗?你的对象是谁呀?等等. 在我们家庭中,有男友的女青年都会说我有对象了,那么她的对象是XX(她的男友). 夫妻间呢?都会说我的爱人是谁谁谁,现在我们 ...
- 简述JavaScript对象、数组对象与类数组对象
问题引出 在上图给出的文档中,用JavaScript获取那个a标签,要用什么办法呢?相信第一反应一定是使用document.getElementsByTagName('a')[0]来获取.同样的,在使 ...
- 深入理解javascript对象系列第二篇——属性操作
× 目录 [1]查询 [2]设置 [3]删除[4]继承 前面的话 对于对象来说,属性操作是绕不开的话题.类似于“增删改查”的基本操作,属性操作分为属性查询.属性设置.属性删除,还包括属性继承.本文是对 ...
- Javascript对象的方法赋值
Javascript对象编程学习中,一直不能很好的掌握对象的属性(property)和方法(method).今天在写代码过程中,又犯了一个低级错误. <!DOCTYPE html> < ...
- web前端学习(二) javascript对象和原型继承
目录 1. JavaScrpt对象 2. 原型对象和继承 3. 对象的克隆 (1)javascript对象 在JS中,对象是属性的容器.对于单个对象来说,都由属性名和属性值构成:其中属性名需要是标识符 ...
- 如何判断Javascript对象是否存在
Javascript语言的设计不够严谨,很多地方一不小心就会出错. 举例来说,请考虑以下情况. 现在,我们要判断一个全局对象myObj是否存在,如果不存在,就对它进行声明.用自然语言描述的算法如下: ...
- JavaScript 对象、DOM对象、jquery对象的区别、转换详解
一.JavaScript 对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 访问对象的属性: [javascrip ...
- 关于javascript对象的简单记忆法
关于javascript对象方法的简单记忆法(个人整理) string对象: 大号小号闪烁加链接./big/small/blink/link/ 粗体斜体打字删除线./bold/italics/fixe ...
随机推荐
- [转]NET Core中实现一个Token base的身份认证
本文转自:http://www.cnblogs.com/Leo_wl/p/6077203.html 注:本文提到的代码示例下载地址> How to achieve a bearer token ...
- hdu5317 RGCDQ (质因子种数+预处理)
RGCDQ 题意:F(x)表示x的质因子的种数.给区间[L,R],求max(GCD(F(i),F(j)) (L≤i<j≤R).(2<=L < R<=1000000) 题解:可以 ...
- 【原】使用VirtIE6代替IE6
做前端开发难免要使用IE6,相信很多朋友知道win7上是不支持安装IE6的,通常会使用IETester,要么在win7中安装虚拟机,在虚拟机中安装IE6. 分析下这2种方式: IETester:并不是 ...
- linux 、 jmeter部署安装
1.安装&配置 可在Linux服务器上利用服务器强大的性能,执行JMeter进行性能测试. 当然,可在Windows机器上先编好测试计划(注意版本匹配,否则可能产生莫名错误),然后下载到Lin ...
- Django调用JS、CSS、图片等静态文件
zz 在下面的例子中,我们将media作为静态(CSS\JS\图片文件)文件的目录 方法一. 1.首先在settings.py文件中自定义参数 STATIC_PATH=’./media’ .(意为当前 ...
- 修改js confirm alert 提示框文字的简单实例
修改js confirm alert 提示框文字的简单实例: <!DOCTYPE html> <html> <head lang="en"> & ...
- ASP.net 实现禁止用户重复登录
本文先为大家介绍如何利用缓存Cache方便地实现此功能. Cache与Session这二个状态对像的其中有一个不同之处,Cache是一个全局对象,作用的范围是整个应用程序,所有用户:而Session是 ...
- c语言游戏推箱子
前两天做了推箱子小游戏,看似简单的一个小游戏背后却 有巨大的秘密,这秘密就是一大堆逻辑. 自从学习了函数过后,的确是解决了很多问题,而且调用很方便,尽管我现在都不是很会调用. 写完一个函数,准备测试一 ...
- Office2013插件开发Outlook篇(2)-- Ribbon
一.获取当前实例 在Ribbon1的任何方法中调用如下代码,可获取当前实例. 如: Application application = new Application(); var list = ap ...
- angularjs + fis +modJS 对于支持amd规范的组建处理(PhotoSwipe 支持,百度webUpload支持)
这不是很好的处理方式,但是能够解决问题,希望有大神推荐更好的方式. 前端模块使用angularjs + fis +modJS 开发前端应用有两个月了.总结了以下的优点: fis 自动构建,自动发布,功 ...