javascript
杂乱无章之javascript（一）
1.in 要求第一個（左邊的）操作數必須是字符串類型或是可以轉化成字符串類型的其他類型，而第二（右邊的）操作數必須是數組或對象。只有第一個操作數的值是第二個操作數的屬性名，才會返回true,否則返回false。對于對象而言比較的是對象的屬性名，而對于數組比較的是數組的下標是否合法。
<script language="javascript">
var box={box_length:200,box_width:100};
var arr={"box_length",200,"200"};
var x="box_length";
var y=2;
if(x in box)
{
?document.write("變量x包含在對象box中！");//返回true
}
else
{
?document.write("變量x不包含在對象box中！");//返回false
}
if(y in box)
{
?document.write("變量y包含在對象box中！");//返回false
}
else
{
?document.write("變量y不包含在對象box中！");//返回true
}
if(x in arr)
{
?document.write("變量x包含在數組arr中！");//返回false
}
else
{
?document.write("變量x包含在數組arr中！");//返回true
}
if(y in arr)
{
?document.write("變量y包含在數組arr中！");//返回true
}
else
{
?document.write("變量y不包含在數組arr中！");//返回flase
}
</script>
2.with???
語法：with(對象)
??<語句塊>
<html>
<head>
<title>with語法演示</title>
</head>
<body>
<form name="myform">
?<input type="text" name="mytext1" /><br />
??? <input type="text" name="mytext2" /><br />
??? <input type="text" name="mytext3" />
</form>
<script language="javascript">
?document.form[0].mytext1.value="第一個文本框";
?with(document.forms[0])
?{
??mytext2.value="第二個文本框";
??mytext3.value="第三個文本框";
?}
</script>
</body>
</html>
3.函數(三種寫法)
<script language="javascript">
?var mySum=new Function("x","y","return x+y");//Function()可以接受一個或多個參數，Function()構造函數的最后一個參數為函數體的內容。
?
?function mySum(x,y)
?{
??return x+y;
?}
?
?var mySum=function(x,y){return x+y;};
</script>
4.instanceof
用來判斷對象是否屬由某個構造函數定義的。要求第一個操作數是一個對象或數組的名稱，而第二個操作數是對象類的名字。若第一個操作數是第二個操作數的實例，則會返回true;反之返回false。
<script language="javascript">
var myDate=new Date();
if(myDate instanceof Date)
{
?document.write("myDate是Date類的實例！");//返回true
}
else
{
?document.write("myDate不是Date類的實例！");//返回false
}
if(myDate instanceof Object)
{
?document.write("所有類都是Object類的實例！");//返回true
}
else
{
?document.write("所有類都不是Object類的實例！");//返回false
}
</script>
5.typeof
返回變量的數據類型
<script language="javascript">
var a="aldsfjkadf";
document.write(typeof(a));//輸出結果是“string”
</script>
6.this???????? this[.屬性]
<html>
<head>
<title>this用法的演示</title>
<script language="javascript">
function output1(obj)
{
?alert(obj.value);
}
function output2(str)
{
?alert(str);
}
</script>
</head>
<body>
?<input type="text" value="第1個文本框" onClick="output1(this)" />
??? <input type="text" value="第2個文本框" onClick="output2(this.value)" />
</body>
7.函數---獲得實際傳遞參數的值(Arguments)
<script language="javascript">
function myFun(x,y)
{
?if(arguments.length!=2)
?{
??var str="傳遞參數個數有誤，共傳遞了"+arguments.length+"個參數！";
??str+="傳遞的參數值分別為：<br>";
??for(i=0;i<arguments.length;i++)
??{
???str+="第"+(i+1)+"個參數值為"+arguments[i]+"<br>";
??}
??return str;
?}
?else
?{
??var z=x+y;
??return z;
?}
}
</script>
<script language="javascript">
function Paixu()
{
?var arrLength=arguments.length;
?for(i=0;i<arguments.length;i++)
?{
??for(j=arrLength;j>i;j--)
??{
???if(arguments[j]<arguments[j-1])
???{
????temp=arguments[j];
????arguments[j]=arguments[j-1];
????arguments[j-1]=temp;
???}
??}
?}
?for (i=0;i<arrLength;i++)
?{
??document.write(arguments[i]+" ");
?}
}
Paixu(12,4,8,3,6,2,0,1,25)
</script>
8.函數---獲得函數定義參數的個數(length)
函數的length和arguments對象的length屬性不同，arguments對象的length只能在函數內使用，而函數的length屬性可以在函數外使用。
<script language="javascript">
?function myCheck(parames)
?{
??if(parames.length!=parames.callee.length)//parames就是arguments;arguments.callee.length返回的是正在使用的函數定義參數的個數
??{
???return false;
??}
??else
??{
???return true;
??}
?}
</script>
9.call()方法??? 函數名.call(對象名,參數1,參數2,...)
改方法可以像調用其他對象的方法一樣調用某個函數的。
<script language="javascript">
function Paixu()
{
?var arrLength=arguments.length;
?for(i=0;i<arguments.length;i++)
?{
??for(j=arrLength;j>i;j--)
??{
???if(arguments[j]<arguments[j-1])
???{
????temp=arguments[j];
????arguments[j]=arguments[j-1];
????arguments[j-1]=temp;
???}
??}
?}
?for (i=0;i<arrLength;i++)
?{
??document.write(arguments[i]+" ");
?}
}
var myObject=new Object();
Paixu.call(myObject,13,3,45);
</script>
10.系統函數--求值函數eval()
該函數主要作用是將字符串指定為對象。
<script language="javascript">
function pen(color,price)
{
?this.color=color;
?this.price=price;
}
var pen1=new pen("紅色",10);
var pen2=new pen("綠色",20);
var pen3=new pen("黑色",30);
for(i=1;i<4;i++)
{
?var penx=eval("pen"+i);
?document.write("筆"+i+"的顏色為"+penx.color+"，價格為"+penx.price+"<br>");
}
</script>
11.系統函數--數值判斷isNaN()
用來判斷變量是否為數字型變量。如果該參數返回false,說明該變量為數字型變量，否則是非數字型變量。
<script language="javascript">
function mySum(x,y)
{
?if(isNaN(x) || isNaN(y))
?{
??return "參數類型必須是數字類型！";
?}
?else
?{
??return (x+y);
?}
}
document.write(mySum(1,2));
document.write(mySum(6,"a"));
</script>
12.創建有默認值的構造函數
<script language="javascript">
function pen(name,color,price)
{
?this.name=name;
?this.color=color;
?if(price==undefined)
?{
??this.price=20;
?}
?else
?{
??this.price=price;
?}
}
var pen1=new pen("鉛筆","紅色",40);
document.write(pen1.name);
document.write(pen1.color);
document.write(pen1.price);
</script>
13.創建有方法的構造函數
<script language="javascript">
function written(str)
{
?document.write(str+"<br>");
}
function pen(name,color,price)
{
?this.name=name;
?this.color=color;
?this.price=price;
?this.write=write;
}
var pen1=new pen("鋼筆","紅色",100);
document.write(pen1.name);
document.write(pen1.color);
document.write(pen1.price);
pen1.write("鋼筆字");
</script>
14.修改對象原型
<script language="javascript">
function pen(color,price)
{
?this.color=color;
?this.price=price;
}
pen.prototype.name="鋼筆";
var mypen=new pen("紅色",20);
document.write("筆的名稱"+mypen.name);
pen.prototype.name="鉛筆";
document.write("筆的名稱"+mypen.constructor.prototype.name);
</script>
15.constructor屬性：返回對象的構造函數
typeof可以判斷操作數的類型，若操作數是對象則返回“object”，但它不能判斷對象是什么類型的對象。Object對象中的constructor屬性可以判斷一個對象的類型，constructor屬性引用的是對象的構造函數。
<script language="javascript">
var myObject1=new Object();
var myObject2=new Object(1.12234324);
var myObject3=new Object(false);
var myObject4=new Object("str");
if(myObject1.constructor==Object)
{
?document.write("這是一個對象<br>");
}
if(myObject2.constructor==Number)
{
?document.write("這是一個數字對象<br>");
}
if(myObject3.constructor==Boolean)
{
?document.write("這是一個布爾對象<br>");
}
if(myObject1.constructor==String)
{
?document.write("這是一個字符串對象<br>");
}
</script>
16.valueOf()方法：返回對象的原始值
valueOf()返回的是與對象相關的原始值，如果對象相關的原始值不存在，則返回對象本身。語法：object.valueOf()
<script language="javascript">
var myObject1=new Object();
myObject1.name="鉛筆";
myObject1.price=20;
var myObject2=new Object(1.23453463);
var myObject3=new Object(false);
var myObject4=new Object("str");
document.write(myObject1.valueOf());//返回[object Object]
document.write(myObject2.valueOf());//返回1.23453463
document.write(myObject3.valueOf());//返回false
document.write(myObject4.valueOf());//返回str
</script>
17.日期對象
new Date();
new Date(str);
new Date(year,month,day,hours,minutes,seconds,milliseconds);
new Date(milliseconds1);//代表距離1970年1月1日0點時的毫秒數。
<script language="javascript">
var myDate1=new Date();
document.write(myDate1.toLocaleString());
var myDate2=new Date("auguest 31,2009 10:21:00");
var myDate3=new Date(2009,8,31);
var myDate4=new Date("auguest 31,2009");
var myDate5=new Date(2009,9,24,19,53,46);//2009-9-24? 19:53:46
var myDate6=new Date(8000);//創建一個距離1970年1月1日午夜8000毫秒的日期
</script>
18.獲得日期
date.getYear()???? ?//返回對象日期中的年份，不建議使用
date.getFullYear() ?//返回對象日期中的年份，建議使用，以4位數顯示
date.getMonth()??//返回對象日期中的月份，其值范圍0--11，1月份返回0，2月份返回1 .....
date.getDate()??//返回對象日期中的天數，即一個月的某一天。
date.getDay()??//返回對象日期中的日期是一周中的第幾天，其值范圍是0--6，周日為0，周一為1......
<script language="javascript">
var myDate=new Date();
document.write(myDate.getFullYear());
</script>
19.獲得時間
date.getHours()??//返回對象日期中的小時部分
date.getMinutes()?//返回對象日期中的分鐘部分
date.getSeconds()?//返回對象日期中的秒鐘部分
date.getMilliseconds()//返回對象日期中的毫秒部分
date.getTime()??//返回對象日期中的時間與19701月1日0時0分0秒所間隔的毫秒數
date.getTimezoneOffset()//返回對象日期中的本地時間與UTC（世界時間）之間的時差數。
以下是獲取世界時間
date.getUTCHours()
date.getUTCMinutes()
date.getUTCSeconds()
date.getUTCMilliseconds()
20.創建Error對象
new Error()
new Error(message)
<script language="javascript">
function myFun(x,y)
{
?var z;
?try
?{
??if(y==0)
??{
???var myErr=new Error("除數不能為0！");
???throw myErr;
??}
??z=x/y;
?}
?catch(ex)
?{
??z=ex.message;
?}
?return z;
}
document.write(myFun(1,0));
</script>
21.Error對象的屬性
error.name：該屬性為錯誤類型；
error.message：該屬性為錯誤信息。
<script language="javascript">
var myString="My String";
try
{
?var errString=myString.subString(2,4);//使用方法時將方法的大小寫輸入錯誤
}
catch(ex)
{
?document.write("錯誤類型為："+ex.name+"<br>");
?document.write("錯誤信息為："+ex.message);
}
</script>
22.Error對象的方法
error.toString() ：該方法返回的是一個用來表示Error對象的字符串，通常為"[object Error]"。
23.定義數組
有四種定義方式
(1)new Array()? 定義空數組
<script language="javascript">
?var arr=new Array();
?document.write("數組中的元素個數為："+arr.length+"<br>");//返回0
?arr[0]="字符串";
?arr[1]=true;
?arr[2]=13;
?document.write("數組中的元素個數為："+arr.length+"<br>");//返回3
?document.write("數組中的元素值為："+arr+"<br>");//返回“字符串,true,13”
</script>
(2)new Array(size)? 指定數組長度定義數組
<script language="javascript">
?var arr=new Array(3);
?document.write("數組中的元素個數為："+arr.length+"<br>");//返回3
?document.write("數組中的元素值為："+arr+"<br>");//返回“”
?arr[0]="字符串";
?arr[1]=true;
?arr[2]=13;
?document.write("數組中的元素個數為："+arr.length+"<br>");//返回3
?document.write("數組中的元素值為："+arr+"<br>");//返回“字符串,true,13”
</script>
(3)new Array(element1,element2,...)? 指定數組元素定義數組
<script language="javascript">
?var arr=new Array("字符串",true,13);
?document.write("數組中的元素個數為："+arr.length+"<br>");//返回3
?document.write("數組中的元素值為："+arr+"<br>");//返回“字符串,true,13”
</script>
(4)直接定義數組
<script language="javascript">
?var arr=["字符串",true,13]
?document.write("變量arr的構造函數為："+arr.constructor+"<br>");
?document.write("數組中的元素個數為："+arr.length+"<br>");//返回3
?document.write("數組中的元素值為："+arr+"<br>");//返回“字符串,true,13”
</script>
24.刪除數組元素
<script language="javascript">
?var arr=new Array("字符串",true,13);
?document.write("數組中的元素個數為："+arr.length+"<br>");//返回3
?document.write("數組中的元素值為："+arr+"<br>");//返回“字符串,true,13”
?delete arr[1];
?document.write("數組中的元素個數為："+arr.length+"<br>");//返回3
?document.write("數組中的元素值為："+arr+"<br>");//返回“字符串,,13”
</script>
25.數組元素的個數
array.length
<script language="javascript">
?var myString="This is my string";
?var myArr=myString.split(" ");
?document.write(myArr.length);//返回4
?myArr[myArr.length]="新增元素";
?document.write(myArr.length);//返回5
?document.write(myArr);//返回This,is,my,string,新增元素
</script>
26.toString()方法? 將數組轉換為字符串
27.join()方法? 將數組元素連接成字符串
join()
join(str)
<script language="javascript">
?var str=[1,2,3];
?document.write(arr.join());//返回1,2,3
?document.write(arr.join("-"));//返回1-2-3
?document.write(arr.join("aaa"));//返回1aaa2aaa3
</script>
28.push()方法? 在數組尾部添加元素
push(value,...)
<script language="javascript">
?var arr=[1,2,3];
?var arrlength=arr.push(9);//var arrlength=arr.push(4,5) //arr數組的值為[1,2,3,4,5]
?document.write(arrlength+"<br>"+arr.toString());//返回4? 1,2,3,9
?arrlength=arr.push("a",true,111,666);
?document.write(arrlength+"<br>"+arr.toString());//返回8? 1,2,3,9,a,true,111,666
</script>
29.concat()方法? 添加元素并生成新數組
concat(value,...)
<script language="javascript">
?var oldarr=[1,2,3];
?var newarr=oldarr.concat("a",true,111,666);
?document.write(newarr.toString());//返回1,2,3,a,true,111,666
?document.write(oldarr.toString());//返回1,2,3
</script>
30.unshift()方法? 在數組頭部添加元素（用法和push()方法相同）
31.pop()方法? 刪除并返回數組的最后一個元素
<script language="javascript">
?var arr=[1,2,3];
?document.write(arr.toString());//返回1,2,3
?var lastarr=arr.pop();
?document.write(lastarr);//返回3
?document.write(arr.length);//返回2
?document.write(arr.toString());//返回1,2
</script>
32.shift()方法? 刪除并返回數組的第一個元素（用法和pop方法相同）
33.splice()方法? 刪除、替換或插入數組元素
splice(start,count,value,...)
start：要刪除、替換或插入數組元素的開始位置，即下標。
count：要刪除、替換或插入數組元素的個數，該參數可選。
value：要插入數組元素的值，從start下標開始插入，該參數可選。
splice()方法的返回值是一個數組，刪除元素時，返回的是已刪除的元素；替換元素時，返回的是被替換的元素。
<script language="javascript">
?var arr=[1,2,3,4,5,6,7,8,9];
?document.write(arr.toString());//返回1,2,3,4,5,6,7,8,9
?var arr1=arr.splice(5,1);
?document.write(arr1.toString());//返回6
?document.write(arr.toString());//返回1,2,3,4,5,7,8,9
?var arr2=arr.splice(1,3);
?document.write(arr2.toString());//返回2,3,4
?document.write(arr.toString());//返回1,5,7,8,9
?var arr3=arr.splice(1,3,"a","b","c","d","e");
?document.write(arr3.toString());//返回5,7,8
?document.write(arr.toString());//返回1,a,b,c,d,e,9
?var arr4=arr.splice(1,0,true,false);
?document.write(arr4.toString());//返回
?document.write(arr.toString());//返回1,true,false,a,b,c,d,e,9
</script>
34.slice()方法? 返回數組中的一部分
slice(start,end)
start：返回數組部分的開始處的數組下標。該值可以為負數，若為負數則表示從數組的最后1個元素開始計數位置，如-1為數組的最后1個元素，-2為數組的倒數第2個元素；
end：返回數組部分的結束處的數組下標。該值可以為負數，若為負數則表示從數組最后1個元素開始計數位置，如-1為數組的最后1個元素，-2為數組的倒數第2個元素；
slice方法返回的也是一個數組，是原數組的一個片段，即從start到end為止的所有元素，不包括end元素。
<script language="javascript">
?var arr=[1,2,3,4,5,6,7,8,9];
?var arr1=arr.slice(1,5);
?document.write(arr.toString());//返回1,2,3,4,5,6,7,8,9
?document.write(arr1.toString());//返回2,3,4,5
?var arr2=arr.slice(1,-1);
?document.write(arr2.toString());//返回2,3,4,5,6,7,8
?var arr3=arr.slice(-5,-1);
?document.write(arr3.toString());//返回5,6,7,8
?var arr4=arr.slice(4);
?document.write(arr4.toString());//返回5,6,7,8
</script>
35.reverse()方法? 顛倒數組中的元素
<script language="javascript">
?var arr=[1,2,3,4,5,6,7,8,9];
?document.write(arr.toString());//返回1,2,3,4,5,6,7,8,9
?arr.reverse();
?document.write(arr.toString());//返回9,8,7,6,5,4,3,2,1
</script>
36.sort()方法? 將數組元素排序
sort()
sort(order)
其中order參數是可選參數，用來指定使用什么方法來對數組中的元素進行排序，若省略order參數，將按字符編碼的順序排序，反之則必須指定order的參數。order參數必須是一個函數，該函數應該有兩個參數（假設x和y）。在使用sort()排序時，每次比較兩個元素時都會執行比較函數，并將兩個元素作為參數傳遞個比較函數。比較函數有以下兩個返回值
(1)如果返回值大于0，則交換兩個元素的位置。
(2)如果返回值小于或等于0，則不進行操作。
<script language="javascript">
?var arr=[39,35,11,88,55,222,77];
?document.write(arr.toString());//返回39,35,11,88,55,222,77
?arr.sort();
?document.write(arr.toString());//返回11,222,35,39,55,77,88
?//正序排序
?function ascorder(x,y)
?{
??if(x>y)
??{
???return 1;
??}
??else
??{
???return -1;
??}
?}
?//倒序排序
?function descorder(x,y)
?{
??if(x>y)
??{
???return -1;
??}
??else
??{
???return 1;
??}
?}
?arr.sort(ascorder);
?document.write(arr.toString());//返回11,35,39,55,77,88,222
?arr.sort(descorder);
?document.write(arr.toString());//返回222,88,77,55,39,35,11
</script>
轉載于:https://www.cnblogs.com/jassy/p/4229468.html
總結
以上是生活随笔為你收集整理的杂乱无章之javascript（一）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： [转]高效编程之欲擒故纵
- 下一篇： 优化JS加载时间过长的一种思路