今天学习了几个引用类型及其它们的一些基础的操作,记录下来~~~
和之前的格式差不多,主要是代码~~~边看书边练习留下来的,和大家分享
/*============================================================================
# FileName: ex6.js
# Desc:
# Author: baobaoyeye
# Email: bao.renyi@gmail.com
# HomePage: http://karloo.com http://blog.csdn.net/baobaoyeye
# Version: 0.0.1
# LastChange: 2011-07-25 23:14:33
# History:
#===========================================================================*/
//Object的声明有两种方式
function fun1(){
var o1 = new Object();
o1.name = "baobaoyeye";
o1.age = 23;
var o2 = {
name: "baobaoyeye1",
age: 24
};
var o3 = {};
o3.name = "baobaoyeye2";
o3.age = 25;
document.getElementById("fun1show1").value = o1.name;
document.getElementById("fun1show2").value = o1.age;
document.getElementById("fun1show3").value = o2.name;
document.getElementById("fun1show4").value = o2.age;
document.getElementById("fun1show5").value = o3.name;
document.getElementById("fun1show6").value = o3.age;
}
//函数需要大量可选参数的时候可以使用字面量来传递
function showNameAndAge(args){
var output="";
if(typeof args.name=="string" && args.name!="input your name"){
output+="Your name is "+args.name;
}
if(!isNaN(args.age)){
output+=" ,your age is "+args.age;
}
return output;
}
function fun2(){
var name = document.getElementById("fun2input1").value;
var age = document.getElementById("fun2input2").value;
var show = showNameAndAge({name: name,age: age});
alert(show);
}
//Object的属性可以作为使用数组序号的方式访问
function fun3(){
var o1 = new Object();
o1.atr1 = 1;
o1.atr2 = 2;
o1.atr3 = 3;
o1.atr4 = 4;
o1.atr5 = 5;
var str1 = "";
var str2 = "atr";
for(var i=1; i<6; i++){
var str3 = str2 + i;
str1 += o1[str3];
}
alert(str1);
}
//Array的各种初始化,赋值
function fun4(){
var a1 = new Array();
document.getElementById("fun4show1").value = a1.length;
var a2 = new Array(2);
document.getElementById("fun4show2").value = a2.length;
document.getElementById("fun4show3").value = a2[1];
var a3 = new Array("num1","num2","num3");
document.getElementById("fun4show4").value = a3[2];
var a4 = new Array("num4");
var a5 = new Array(3);
var a6 = new Array("4");
alert("Array(\"num4\") len = "+a4.length+
"\nArray(3) len = "+a5.length+
"\nArray(\"4\") len = "+a6.length);
var str1 = "";
var a7 = ["num5","num6","num7"];
for (var i = 0; i < a7.length; i++){
str1 += a7[i] +" ";
}
alert(str1);
alert("a7.length = "+a7.length);
a7[a7.length] = "num8";
alert("a7.length = "+a7.length);
}
//Array的输出转换
function fun5(){
//toString() valueOf() 用法
var a1 = ["num1","num2","num3"];
alert("a1.toString() = "+a1.toString()+
"\na1.valueOf() = "+a1.valueOf()+
"\na1 = "+a1);
//toLocaleString() toString() 用法
var o1 = {
toLocaleString: function(){
return "tls1";
},
toString: function(){
return "ts1";
}
};
var o2 = {
toLocaleString: function(){
return "tls2";
},
toString: function(){
return "ts2";
}
};
alert("o1 ==>"+o1+
"\no2 ==>"+o2+
"\no1.toString ==>"+o1.toString()+
"\no2.toString ==>"+o2.toString()+
"\no1.toLocaleString ===>"+o1.toLocaleString()+
"\no2.toLocaleString ===>"+o2.toLocaleString()
);
//join方法
alert(a1);
alert(a1.join("@"));
alert(a1.join("!@#$%^&*((()*&^%$#@((((((((((((((((((((((\"___"));
}
//Array栈实现
var globalA1 = new Array();
function push(){
var arg1 = document.getElementById("fun6input1").value;
var arg2 = document.getElementById("fun6input2").value;
var count = 0;
if(arg2.length>0){
count = globalA1.push(arg1,arg2);
}else{
var count = globalA1.push(arg1);
}
alert(count);
}
function pop(){
if(globalA1.length>0){
var item = globalA1.pop();
alert(item);
}
else{
alert("it is empty");
}
}
function fun6(){
alert(globalA1);
}
//Array队列实现
var globalA2 = new Array();
function push(){
var arg1 = document.getElementById("fun7input1").value;
var arg2 = document.getElementById("fun7input2").value;
var count = 0;
if(arg2.length>0){
count = globalA2.push(arg1,arg2);
}else{
var count = globalA2.push(arg1);
}
alert(count);
}
function shift(){
if(globalA2.length>0){
var item = globalA2.shift();
alert("shift : "+item);
}else{
alert("it is empty");
}
}
function unshift(){
var arg1 = document.getElementById("fun7input1").value;
var arg2 = document.getElementById("fun7input2").value;
var count = 0;
if(arg2.length>0){
count = globalA2.unshift(arg1,arg2);
}else{
var count = globalA2.unshift(arg1);
}
alert(count);
}
function pop(){
if(globalA2.length>0){
var item = globalA2.pop();
alert(item);
}else{
alert("it is empty");
}
}
function fun7(){
alert(globalA2);
}
//sort()和reverse()方法
function fun8(){
var a1 = new Array();
var a2 = new Array();
a1 = [1,2,3,4,5,6,7];
a2 = [1,5,15,20,25];
a1.reverse();
alert("After a1.reverse() "+a1);
a1.sort();
alert("After a1.sort() "+a1);
//默认sort()按照string排序,结果不一定是想要的!!!
a2.sort();
alert("After a2.sort() "+a2);
}
//带有compare的sort()
function compare(){
return arguments[0] - arguments[1];
}
function fun9(){
var a2 = [1,5,15,20,25];
alert(a2);
a2.sort(compare);
alert("After a2.sort(compare) "+a2);
}
//concat()函数,复制原来数组到一个新的数组,并可以以参数的形式在
//新数组后追加其他的元素(数组)
function fun10(){
var a1 = new Array("num1","num2","num3");
alert("a1 = " + a1);
var a2 = a1.concat("num5",["num4","num6"]);
alert("a1 = " + a1+
"\na2 = " + a2);
var a3 = a1.concat();
alert("a1 = " + a1+
"\na2 = " + a3);
}
//slice()函数,通过当前数组一个或多个项创建一个新数组
function fun11(){
var a1 = ["num1","num2","num3","num4","num5","num6"];
var a2 = a1.slice(2);
var a3 = a1.slice(1,4);
alert("a1 = " + a1 +
"\na2 = " + a2 +
"\na3 = " + a3);
}
//splice()函数,删除任意数量的项splice(beginNum,count)
// 插入任意数量的项splice(beginNum,0,"Num1","Num2",...)
// 替换任意数量的项splice(beginNum,deleteNum,"Num1","Num2",...)
function fun12(){
var a1 = ["num1","num2","num3","num4","num5","num6"];
var rm_a1 = a1.splice(1,2);
alert("a1 = " + a1 +
"\nrm_a1 = " + rm_a1
);
var insert_a1 = a1.splice(2,0,"num7","num8","num9");
alert("a1 = " + a1 +
"\ninsert_a1 = " + insert_a1);
var change_a1 = a1.splice(2,1,"num10","num11","num12");
alert("a1 = " + a1 +
"\nchange_a1 = " + change_a1);
}
<!--==========================================================================
# FileName: ex6.html
# Desc:
# Author: baobaoyeye
# Email: bao.renyi@gmail.com
# HomePage: http://karloo.com
# Version: 0.0.1
# LastChange: 2011-07-25 23:14:25
# History:
#==========================================================================-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1-transitional.dtd">
<html html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test 3 of javascript</title>
<script src="ex6.js" defer="defer" type="text/javascript"></script>
</head>
<body>
<div>
<input type="button" value="fun1btn" id="fun1btn" οnclick="fun1()" />
<input type="text" id="fun1show1" value=""/>
<input type="text" id="fun1show2" value=""/>
<input type="text" id="fun1show3" value=""/>
<input type="text" id="fun1show4" value=""/>
<input type="text" id="fun1show5" value=""/>
<input type="text" id="fun1show6" value=""/>
</div>
<div>
<input type="text" id="fun2input1" value="input your name" />
<input type="text" id="fun2input2" value="input your age" />
<input type="button" id="fun2btn" value="fun2btn" οnclick="fun2()"/>
</div>
<div>
<input type="button" id="fun3btn" value="fun3btn" οnclick="fun3()"/>
</div>
<div>
<input type="button" id="fun4btn" value="fun4btn" οnclick="fun4()"/>
<input type="text" id="fun4show1" value=""/>
<input type="text" id="fun4show2" value=""/>
<input type="text" id="fun4show3" value=""/>
<input type="text" id="fun4show4" value=""/>
</div>
<div>
<input type="button" id="fun5btn" value="fun5btn" οnclick="fun5()"/>
</div>
<div>
<input type="text" id="fun6input1" value="" />
<input type="text" id="fun6input2" value="" />
<input type="button" id="fun6btn1" value="push" οnclick="push()"/>
<input type="button" id="fun6btn2" value="pop" οnclick="pop()"/>
<input type="button" id="fun6btn3" value="fun6btn" οnclick="fun6()"/>
</div>
<div>
<input type="text" id="fun7input1" value="" />
<input type="text" id="fun7input2" value="" />
(((((((((((((
<input type="button" id="fun7btn1" value="push" οnclick="push()"/>
<input type="button" id="fun7btn2" value="shift" οnclick="shift()"/>
)))))))))))))
<input type="button" id="fun7btn1" value="unshift" οnclick="unshift()"/>
<input type="button" id="fun7btn2" value="pop" οnclick="pop()"/>
<input type="button" id="fun7btn3" value="fun7btn" οnclick="fun7()"/>
</div>
<div>
<input type="button" id="fun8btn" value="fun8btn" οnclick="fun8()"/>
</div>
<div>
<input type="button" id="fun9btn" value="fun9btn" οnclick="fun9()"/>
</div>
<div>
<input type="button" id="fun10btn" value="fun10btn" οnclick="fun10()"/>
</div>
<div>
<input type="button" id="fun11btn" value="fun11btn" οnclick="fun11()"/>
</div>
<div>
<input type="button" id="fun12btn" value="fun12btn" οnclick="fun12()"/>
</div>
</body>
</html>
明天学习Date类型,然后结合这javascript画图,做个简单的动画时钟,嘿嘿!争取明天的这个时候能搞定!