JavaScript網頁程式設計之------一些常用的對象
註：下文中用到的println()方法都是另外導入的out.js方法中寫的
out.js：
function print(param){
document.write(param);
}
function println(param){
document.write(param+"<br/>");
}在with語句區塊中，可以省去物件名稱的引用
var dd2 = new Date();
with(dd2){//在with语句块中，可以省去对象名“dd2”的引用
var year = getFullYear(); //dd2.getFullYear()
var month= getMonth(); //从0开始的月份数
var day = getDate();//返回月份中的第几天
println(year+"年"+month+"月"+day+"日 ");
}一、Object物件
<html>
<head>
<title>Object对象的用法演示</title>
</head>
<body>
<script type="text/javascript">
/*toString()将对象转换成字符串*/
function show(){
alert("show......");
}
//alert(show);//默认调用toString()
//alert(show.toLocaleString());
//alert(show.toString());
var arr=[1,2,3,8];
//alert(arr.toString());
//alert(arr);//默认调的toString()
/*valueOf(): 返回指定对象的原始值 */
//alert(arr.valueOf());//结果和toString()一样
//alert(show.valueOf());//结果和toString()一样
</script>
</body>
</html>二、String 物件
1、建立String物件的兩種方式
1）var str = new String("abc123");
2）var str2 = "abcd1234";2、String物件當中的屬性
str.length：字串長度
方法
bold()：加粗
fontcolor("red")：設定顏色
link("http://www.hncu.net")：設定為超連結
substring(1, 5)：取子字串[1,5)，Java一樣，左包含，右不包含
substr(1,5)：取子字串：從1位置開始，取5個字元
三、Date 物件
1、 Date物件的建構
var date = new Date(); println(date); //GMT格式输出 println(date.toLocaleString());//转成本地系统的日期时间格式输出。 println(date.toLocaleDateString()); //只有日期，没有时间
2、從物件解析出對應的日期元素
//var year = date.getYear();//过时了，尽量不用 。它是返回从1900到当前日期所经过的年份 var year = date.getFullYear(); println(year); var month= date.getMonth(); //从0开始的月份数 println(month); var day1 = date.getDay(); //返回星期中的第几天,0为星期天 println(day1); var day2 = date.getDate();//返回月份中的第几天 println(day2);
3、要求顯示某個日期的「星期幾」
function getWeekDay( num ){
var weeks = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'];
return weeks[num];
}
var weekDay = getWeekDay( date.getDay() );
println(weekDay);4、日期物件和毫秒值之間的轉換
var date2 = new Date();
var time = date2.getTime();//日期对象-->毫秒值
println("time:"+time);
var date3 = new Date(time);
println(date3.toLocaleDateString());5、日期物件和字串之間進行轉換
//日期对象-->字符串：toLocaleString() 和 toLocaleDateString() //字符串-->日期 //var strDate="9/27/15";//细节：如果年份只给两位有效数字，那是代表19**年。如果是2000年以后的年份，要给4位 var strDate="9/27/2015 ";//细节：如果年份只给两位有效数字，那是代表19**年。如果是2000年以后的年份，要给4位 var time = Date.parse(strDate);//返回的是毫秒数 var d = new Date(time); println(d.toLocaleString());
6、日期解析错误时，抛异常
<script type="text/javascript">
Date.prototype.parse2 =function(str){
throw new Exception();
};
try{
var strDate2="9/27/2ewewwe15 ";//细节：如果年份只给两位有效数字，那是代表19**年。如果是2000年以后的年份，要给4位
var time2 = Date.parse2(strDate2);//返回的是毫秒数
}catch(e){
alert("日期解析错误....我给的提示....");
}
</script>四、Math 对象
Math.ceil(12.34);//向上进位
Math.floor(12.34);//向下进位
Math.round(12.54);//四舍五入
Math.pow(5,6);//5的6次方
//生成10个[0,10]范围内的随机整数
for (var x=0;x<10;x++){
//var n=Math.floor(Math.random()*11);//法1
//var n=Math.round(Math.random()*10);//法2
var n=parseInt(Math.random()*11);//法3
println(x+": "+n);
}五、Global对象
Global对象中的方法是全局方法，调用时可以省略Global，直接写方法名
1、parseInt()中的基数用法----进制转换
1）将指定进制格式的字符串转换成-->10进制数
//var num = parseInt("110",10); //110
//var num = parseInt("110",2); //6
var num = parseInt("0x3c",16); //602）10进制转换成--->非10进制
var num2 = new Number(6); println( "num2="+ num2.toString(2) ); var num3 = 60; println( "num3="+ num3.toString(16) );
2、for(in)语句的用法
1）格式：
for(变量 in 对象){
...//对对象中的元素进行遍历操作
}
<script type="text/javascript">
/*
<span style="white-space:pre"> </span>for( 变量名 in 对象 ){
...//分别对对象中的元素(属性)进行遍历操作
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>*/
<span style="white-space:pre"> </span>//数组对象
<span style="white-space:pre"> </span>var arr=[12,13,22,-1,56,0,9];
<span style="white-space:pre"> </span>for (x in arr){//注意，对于数组，这里的x是下标即是0,1,2,3,...
<span style="white-space:pre"> </span>println(x+": "+arr[x]);
<span style="white-space:pre"> </span>}
<span style="white-space:pre"> </span>print("<hr/>");
//用for...in语句操作自定义对象
for (x in p2){//x是函数中的成员变量与成员方法的名称
println(x+"------"+p2[x]);// p2[x]就是valeOf(x)
}
</script>六、自定义对象
对js来描述对象--Person
1、方法1:本质上，有点类似于Java当中的直接new一个空参对象，然后往里面直接添加变量
<script type="text/javascript">
function Person(){
//alert("Person...");
println("Person...");
}
var p = new Person();
//要为Person对象p添加变量，直接使用：p.对象名=...
p.name = "Jack";
p.age = 24;
//alert(p.name+"---"+p.age);
//要为Person对象p添加方法，直接使用：p.方法名=...
p.show = function(){
println(p.name+"---"+p.age);
};
p.show();//调方法
var obj = new Object();
obj.name = "God";
obj.age =10000;
obj.show = function(){
println(obj.name+"::::"+obj.age);
};
obj.show();
</script>2、方法2:更接近于Java当中的面向对象的方式----类的封装
<script type="text/javascript">
//方式2:更接近于Java当中的面向对象的方式----类的封装
function Person(name,age){
this.name = name; //这里的this.表示给当前对象添加一个变量
this.age = age;
this.setName= function(name){
this.name = name;
};
this.getName= function(){
return this.name;
};
this.show= function(){
return "name:"+this.name+",age:"+this.age;
};
}
var p = new Person("Tom",22);
println(p.name+"==="+p.age);
p.setName("Rose");
println(p.show());
for(x in p){ //x为自定义对象当中的变量名
println(x+":"+p[x]); //p[x]为自定义对象当中的变量值(如果是函数，为它的字节码)
}
</script>3、方式3: map方式, key:value ----类似于java当中的数据封装，把数据封装到Map集合当中
<span style="font-weight: normal;"><script type="text/javascript">
//对象调用成员有两种方式：对象.属性名 和 对象["属性名"]
//1) 对象.属性名的方式应该注意: 如果属性名不符合标识符的命名规则，那么不能采用这种方式调用，如下面例子当中的不能采用map[8]的方式
//2) 对象["属性名"]的方式应该注意:如果属性名符合标识符的命名规则，那么访问时属性名应该要加引号，如下面例子当中的map[name]要写成pp["name"]的形式才行
var pp = {
//"name":"张三","age":"23", //key:value
name:"张三",age:"23", //这句和上面一句等效---key的名称可以省略引号
"getName": function(){
return this.name;
}
};
println(pp.name+"===" + pp.age);
println(pp.getName());
println( pp["name"] ); //用 pp[name]是不行的
//map集合的定义
var map={
8:"张三" , 3:"李四", 5:"Jack"
};
var val = map[8];//8是数字，不是变量名，因此引号省略照样能解析出来
println("val:"+val);
//var val2 = map.8; //不行，因为8不是变量的形式
//println(val2);
</script> </span>4、map数据封装的进一步扩展
<script type="text/javascript">
//属性值是数组
var myMap = {
names:["Jack1","Jack2","Jack4"],
ages:[25,22,18]
};
//取出Jack2的姓名和年龄
println("name:"+ myMap.names[1]);
println("age:"+ myMap.ages[1]);
var myMap2 = {
names:[{name:"Jack1"},{name:"Jack2"},{name:"Jack4"}]
};
//取出Jack1
println("name:"+ myMap2.names[0].name);//或者println(
myMap2.names[0]["name"]);
</script>5、对象的prototype属性
要给对象添加新功能时，直接采用“对象.prototype.新内容”的形式就可以。这内容可以是变量，也可以是函数。
1）为String对象添加一个自定义函数trim：剪去字符串两端的空格
<script type="text/javascript">
function trim(str){
var start, end;
start=0;
end=str.length-1;
while(start<=end && str.charAt(start)==' '){
start++;
}
while(start<=end && str.charAt(end)==' '){
end--;
}
return str.substring(start,end+1);
}
//测试
var s=" dsk dsds ";
//alert("#"+s+"#");
//alert("#"+ trim(s) + "#" );
</script>2）添加变量
String.prototype.aa = 200;
println("abc123".aa);3）添加函数
String.prototype.trim = trim;
println("<hr>");
println("aa3".trim(" abc123 "));
（这里的trim就是上面（1）里面自定义属性中的trim）
注：这里通过“aa3”.trim(" abc123 ")处理的是别的字符串并不是自己4）通过对象直接调用的函数（注意，一定要把前一版本当中的参数str改成this）
<script type="text/javascript">
String.prototype.trim = function(){
var start, end;
start=0;
end=this.length-1;
while(start<=end && this.charAt(start)==' '){
start++;
}
while(start<=end && this.charAt(end)==' '){
end--;
}
return this.substring(start,end+1);
};
println(" aa3 ".trim() );
var str2 =" 76jh dssdds ";
println( str2.trim() );
</script>
注：这里是对自己进行处理6、对象原型修改练习
1）给String对象添加一个toCharArray()方法
2）给String对象添加一个reverse方法：将字符串反转
3）JS当中，函数内部是可以写函数的,而Java是做不到的。但Java有内部类
<script type="text/javascript">
String.prototype.toCharArray= function(){
var chs=[];
for(var x=0; x<this.length; x++){
chs[x] = this.charAt(x);
}
return chs;
};
//给String对象添加一个reverse方法：将字符串反转
String.prototype.reverse=function(){
//JS当中，函数内部是可以写函数的,而Java是做不到的。但Java有内部类
//辅助函数，用于交换数组中的两个元素
function swap(arr,x,y){
var temp = arr[x];
arr[x] = arr[y];
arr[y] = temp;
}
var arr = this.toCharArray();
for(var x=0,y=arr.length-1; x<y; x++,y--){
swap(arr,x,y);
}
return arr.join("-");
};
/*
//辅助函数，用于交换数组中的两个元素
function swap(arr,x,y){
var temp = arr[x];
arr[x] = arr[y];
arr[y] = temp;
}
*/
//测试
var str = "dsjk2323jkjkewio";
println( str.reverse() );
//测试：在外部能否调用函数reverse内部的swap函数
//测试结果：不行的。其实它和局部变量是一个道理。
//因此，以后在写某个函数内部的辅助功能函数时，最好写在内部
/*
var arr =[23,45,7,9];
swap(arr,1,2);
println("kkk");
println(arr);
*/
</script> 以上就是JavaScript网页编程之------一些常用的对象的内容，更多相关内容请关注PHP中文网（www.php.cn）！
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
AI Hentai Generator
免費產生 AI 無盡。
熱門文章
熱工具
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強大的PHP整合開發環境
Dreamweaver CS6
視覺化網頁開發工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
熱門話題
如何使用WebSocket和JavaScript實現線上語音辨識系統
Dec 17, 2023 pm 02:54 PM
如何使用WebSocket和JavaScript實現線上語音辨識系統引言：隨著科技的不斷發展，語音辨識技術已成為了人工智慧領域的重要組成部分。而基於WebSocket和JavaScript實現的線上語音辨識系統，具備了低延遲、即時性和跨平台的特點，成為了廣泛應用的解決方案。本文將介紹如何使用WebSocket和JavaScript來實現線上語音辨識系
WebSocket與JavaScript：實現即時監控系統的關鍵技術
Dec 17, 2023 pm 05:30 PM
WebSocket與JavaScript：實現即時監控系統的關鍵技術引言：隨著互聯網技術的快速發展，即時監控系統在各個領域中得到了廣泛的應用。而實現即時監控的關鍵技術之一就是WebSocket與JavaScript的結合使用。本文將介紹WebSocket與JavaScript在即時監控系統中的應用，並給出程式碼範例，詳細解釋其實作原理。一、WebSocket技
如何利用JavaScript和WebSocket實現即時線上點餐系統
Dec 17, 2023 pm 12:09 PM
如何利用JavaScript和WebSocket實現即時線上點餐系統介紹：隨著網路的普及和技術的進步，越來越多的餐廳開始提供線上點餐服務。為了實現即時線上點餐系統，我們可以利用JavaScript和WebSocket技術。 WebSocket是一種基於TCP協定的全雙工通訊協議，可實現客戶端與伺服器的即時雙向通訊。在即時線上點餐系統中，當使用者選擇菜餚並下訂單
如何使用WebSocket和JavaScript實現線上預約系統
Dec 17, 2023 am 09:39 AM
如何使用WebSocket和JavaScript實現線上預約系統在當今數位化的時代，越來越多的業務和服務都需要提供線上預約功能。而實現一個高效、即時的線上預約系統是至關重要的。本文將介紹如何使用WebSocket和JavaScript來實作一個線上預約系統，並提供具體的程式碼範例。一、什麼是WebSocketWebSocket是一種在單一TCP連線上進行全雙工
JavaScript與WebSocket：打造高效率的即時天氣預報系統
Dec 17, 2023 pm 05:13 PM
JavaScript和WebSocket：打造高效的即時天氣預報系統引言：如今，天氣預報的準確性對於日常生活以及決策制定具有重要意義。隨著技術的發展，我們可以透過即時獲取天氣數據來提供更準確可靠的天氣預報。在本文中，我們將學習如何使用JavaScript和WebSocket技術，來建立一個高效的即時天氣預報系統。本文將透過具體的程式碼範例來展示實現的過程。 We
javascript如何使用insertBefore
Nov 24, 2023 am 11:56 AM
用法：在JavaScript中，insertBefore()方法用於在DOM樹中插入一個新的節點。這個方法需要兩個參數：要插入的新節點和參考節點（即新節點將要插入的位置的節點）。
簡易JavaScript教學：取得HTTP狀態碼的方法
Jan 05, 2024 pm 06:08 PM
JavaScript教學：如何取得HTTP狀態碼，需要具體程式碼範例前言：在Web開發中，經常會涉及到與伺服器進行資料互動的場景。在與伺服器進行通訊時，我們經常需要取得傳回的HTTP狀態碼來判斷操作是否成功，並根據不同的狀態碼來進行對應的處理。本篇文章將教你如何使用JavaScript來取得HTTP狀態碼，並提供一些實用的程式碼範例。使用XMLHttpRequest
JavaScript與WebSocket：打造高效率的即時影像處理系統
Dec 17, 2023 am 08:41 AM
JavaScript是一種廣泛應用於Web開發的程式語言，而WebSocket則是一種用於即時通訊的網路協定。結合二者的強大功能，我們可以打造一個高效率的即時影像處理系統。本文將介紹如何利用JavaScript和WebSocket來實作這個系統，並提供具體的程式碼範例。首先，我們需要明確指出即時影像處理系統的需求和目標。假設我們有一個攝影機設備，可以擷取即時的影像數
