JavaScript学习笔记之JS对象
内容摘要
默认对象
日期对象Date,
格式:日期对象名称=new Date([日期参数])
日期参数:
1.省略(最常用);
2.英文-数值格式:月 日,公元年 [时:分:秒]
如:today=new Date
日期对象Date,
格式:日期对象名称=new Date([日期参数])
日期参数:
1.省略(最常用);
2.英文-数值格式:月 日,公元年 [时:分:秒]
如:today=new Date
文章正文
默认对象
日期对象Date,
格式:日期对象名称=new Date([日期参数])
日期参数:
1.省略(最常用);
2.英文-数值格式:月 日,公元年 [时:分:秒]
如:today=new Date("October 1,2008 12:00:00")
3.数值格式:公元年,月,日,[时,分,秒]
如:today=new Date(2008,10,1)
日期对象的方法:
格式:日期对象名称.方法([参数])
使用例子:
http://www.w3school.com.cn/jsref/jsref_obj_array.asp
<!DOCTYPE html>
<html>
<head>
<title>arrayTest.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<script type="text/javascript">
//var fruits = new Array("Apple", "Banana", "Pear");
var fruits = ["苹果","香蕉","梨"];//推荐使用
//可以动态添加元素
fruits.push("西瓜");
fruits.push("橙子");
for(var i = 0; i < fruits.length; ++i)
{
document.writeln("fruit[" + i + "] = " + fruits[i] + "<br/>");
}
//数组的一些方法测试
with(document)
{
write("<ul>");
write("<li>" + fruits.join()+ "</li>");//默认使用逗号来分隔
write("<li>" + fruits.join(";")+ "</li>");
write("<li>" + fruits.toString()+ "</li>");
write("<li>" + fruits.reverse().join()+ "</li>");
write("<li>" + fruits.valueOf()+ "</li>");
//说明上面的reverse实际上是改变了数组本身
write("</ul>");
}
//二维数组
var people = new Array(3);
people[0] = new Array(1, "zhangsan", "lisi");
people[1] = new Array(2, "Jack", "Lucy");
people[2] = new Array(3, "Xiaoming", "Xiaohong");
//注意数据类型可以混合使用
//遍历二维数组
for(var i = 0 ; i < people.length ; ++i)
{
for(var j= 0 ; j < people[i].length ; ++j)
{
document.write("people["+ i +"]["+ j +"] = " + people[i][j] + "<br/>");
}
document.write("<br/>");
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>emailConfirm.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
function isEmail()
{
var emailValue = document.getElementsByName("email")[0].value;
if(-1 == emailValue.indexOf("@"))
{
alert("请填写正确的Email地址");
}
else
{
alert("Ok");
}
}
</script>
</head>
<body>
<form>
email: <input type="text" name="email"><br/>
<input type="button" value="check" onclick="isEmail()">
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>objectTest.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<script type="text/javascript">
//定义对象的一种方式:通过构造函数
function member(name, gender)
{
//属性
this.name = name;
this.gender = gender;
//方法
this.display = display;//指定member对象的display方法
}
function display()
{
var str = this.name + " : " + this.gender;
//这个display方法被谁使用了,此处的this就指向那个对象
document.writeln(str + "<br/>");
}
//生成对象
var m1 = new member("zhangsan", "male");
var m2 = new member("lisi", "male");
var m3 = new member("wangwu", "male");
var m4 = new member("wangfang", "female");
with(document)
{
write("输出属性","<br/>");
write(m1.name + ":" + m1.gender + "<br/>");
write(m2.name + ":" + m2.gender + "<br/>");
write(m3.name + ":" + m3.gender + "<br/>");
write(m4.name + ":" + m4.gender + "<br/>");
}
document.write("调用方法","<br/>");
m1.display();
m2.display();
m3.display();
m4.display();
</script>
</body>
</html>
数组对象使用实例:
复制代码 代码如下:
<!DOCTYPE html>
<html>
<head>
<title>arrayTest.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<script type="text/javascript">
//var fruits = new Array("Apple", "Banana", "Pear");
var fruits = ["苹果","香蕉","梨"];//推荐使用
//可以动态添加元素
fruits.push("西瓜");
fruits.push("橙子");
for(var i = 0; i < fruits.length; ++i)
{
document.writeln("fruit[" + i + "] = " + fruits[i] + "<br/>");
}
//数组的一些方法测试
with(document)
{
write("<ul>");
write("<li>" + fruits.join()+ "</li>");//默认使用逗号来分隔
write("<li>" + fruits.join(";")+ "</li>");
write("<li>" + fruits.toString()+ "</li>");
write("<li>" + fruits.reverse().join()+ "</li>");
write("<li>" + fruits.valueOf()+ "</li>");
//说明上面的reverse实际上是改变了数组本身
write("</ul>");
}
//二维数组
var people = new Array(3);
people[0] = new Array(1, "zhangsan", "lisi");
people[1] = new Array(2, "Jack", "Lucy");
people[2] = new Array(3, "Xiaoming", "Xiaohong");
//注意数据类型可以混合使用
//遍历二维数组
for(var i = 0 ; i < people.length ; ++i)
{
for(var j= 0 ; j < people[i].length ; ++j)
{
document.write("people["+ i +"]["+ j +"] = " + people[i][j] + "<br/>");
}
document.write("<br/>");
}
</script>
</body>
</html>
字符串对象
建立字符串对象:
格式:字符串对象名称=new String(字符串常量)
格式:字符串变量名称="字符串常量"
一个验证Email的例子:
复制代码 代码如下:
<!DOCTYPE html>
<html>
<head>
<title>emailConfirm.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
function isEmail()
{
var emailValue = document.getElementsByName("email")[0].value;
if(-1 == emailValue.indexOf("@"))
{
alert("请填写正确的Email地址");
}
else
{
alert("Ok");
}
}
</script>
</head>
<body>
<form>
email: <input type="text" name="email"><br/>
<input type="button" value="check" onclick="isEmail()">
</form>
</body>
</html>
自定义对象
前面讲函数的时候讲过一个例子,现在这里再讲一下这个例子:
复制代码 代码如下:
<!DOCTYPE html>
<html>
<head>
<title>objectTest.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<script type="text/javascript">
//定义对象的一种方式:通过构造函数
function member(name, gender)
{
//属性
this.name = name;
this.gender = gender;
//方法
this.display = display;//指定member对象的display方法
}
function display()
{
var str = this.name + " : " + this.gender;
//这个display方法被谁使用了,此处的this就指向那个对象
document.writeln(str + "<br/>");
}
//生成对象
var m1 = new member("zhangsan", "male");
var m2 = new member("lisi", "male");
var m3 = new member("wangwu", "male");
var m4 = new member("wangfang", "female");
with(document)
{
write("输出属性","<br/>");
write(m1.name + ":" + m1.gender + "<br/>");
write(m2.name + ":" + m2.gender + "<br/>");
write(m3.name + ":" + m3.gender + "<br/>");
write(m4.name + ":" + m4.gender + "<br/>");
}
document.write("调用方法","<br/>");
m1.display();
m2.display();
m3.display();
m4.display();
</script>
</body>
</html>
小伙伴们是否对javascript中对象的概念和用法有了新的认识了呢,希望大家能够喜欢本文及本系列文章。
代码注释