Math對(duì)象
- Math 對(duì)象用于執(zhí)行數(shù)學(xué)任務(wù)。
- Math 對(duì)象并不像 Date 和 String 那樣是對(duì)象的類，因此沒有構(gòu)造函數(shù) Math()。
算數(shù)值
JavaScript 提供 8 種可被 Math 對(duì)象訪問的算數(shù)值：
- Math.PI 返回圓周率（約等于3.14159）。
- Math.E 返回算術(shù)常量 e，即自然對(duì)數(shù)的底數(shù)（約等于2.718）。
- Math.SQRT2 返回 2 的平方根（約等于 1.414）。
- Math.SQRT1_2 返回返回 1/2 的平方根（約等于 0.707）。
- Math.LN2 返回 2 的自然對(duì)數(shù)（約等于0.693）。
- Math.LN10 返回 10 的自然對(duì)數(shù)（約等于2.302）。
- Math.LOG2E 返回以 2 為底的 e 的對(duì)數(shù)（約等于 1.443）。
- Math.LOG10E 返回以 10 為底的 e 的對(duì)數(shù)（約等于0.434）。
document.write(Math.PI);
數(shù)值取整
- ceil(x) 對(duì)數(shù)進(jìn)行上舍入。
- floor(x) 對(duì)數(shù)進(jìn)行下舍入。
- round(x) 把數(shù)四舍五入為最接近的整數(shù)。
document.write(Math.floor(3.6));
隨機(jī)數(shù)
- random() 返回 0 ~ 1 之間的隨機(jī)數(shù)。
- 注意并不包括0和1
document.write(Math.random());
三角函數(shù)
- cos(x) 返回?cái)?shù)的余弦。
- acos(x) 返回 x 的反余弦值。
- sin(x) 返回?cái)?shù)的正弦。
- asin(x) 返回 x 的反正弦值。
- tan(x) 返回角的正切。
- atan(x) 以介于 -PI/2 與 PI/2 弧度之間的數(shù)值來返回 x 的反正切值。
document.write(Math.cos(Math.PI/2));
其他方法
- max(x,y) 返回 x 和 y 中的最高值。
- min(x,y) 返回 x 和 y 中的最低值。
- abs(x) 返回 x 的絕對(duì)值。
- atan2(y,x) 返回從 x 軸到點(diǎn) (x,y) 的角度（介于 -PI/2 與 PI/2 弧度之間）。
- exp(x) 返回 e 的指數(shù)。
- log(x) 返回?cái)?shù)的自然對(duì)數(shù)（底為e）。
- pow(x,y) 返回 x 的 y 次冪。
- valueOf() 返回 Math 對(duì)象的原始值
document.write(Math.max(5,10));
字符串對(duì)象
- 字符串是非常重要的數(shù)據(jù)類型，除了基本字符串外，JavaScript還提供了字符串的引用類型--字符串對(duì)象。
- 字符串對(duì)象提供了字符串檢索、替換、連接等方法...
- 可以通過new 關(guān)鍵字創(chuàng)建字符串對(duì)象
- var str=new String()
- length 屬性返回字符串的長度(字符數(shù))。
var str1 = "hello";
var str2 = new String()
document.write(typeof str1);
document.write(typeof str2);
document.write(str1.length);
document.write(str2.length);
字符串與數(shù)字的轉(zhuǎn)換
- toString() 返回字符串。可以將數(shù)值轉(zhuǎn)換成字符串。
- 如果需要獲取數(shù)值的二進(jìn)制、八進(jìn)制、十六進(jìn)制的字符串表示，則可以給toString()傳遞一個(gè)表示進(jìn)制的的整數(shù)
- parseInt()函數(shù)可以將字符串轉(zhuǎn)換成整數(shù)
- parseFloat()函數(shù)可以將字符串轉(zhuǎn)換浮點(diǎn)數(shù)
- Number()函數(shù)可以將任意類型的值轉(zhuǎn)換數(shù)值。
var str2 = num.toString();
var str2 = num.toString(2);
var str2 = parseInt(num);
字符串對(duì)象的常用方法
- charAt() 返回在指定位置的字符。
- charCodeAt() 返回在指定的位置的字符的 Unicode 編碼。
- concat() 連接字符串。
- slice(n,m) 提取字符串n到m之間的片斷(不包括m位置的字符串)，并在新的字符串中返回被提取的部分。
- substring() 提取字符串中兩個(gè)指定的索引號(hào)之間的字符。大多數(shù)情況和上一個(gè)作用相同，當(dāng)參數(shù)為負(fù)值時(shí)會(huì)有不同，但這種情況較少用
- substr(n,m) 從起始索引號(hào)提取字符串中指定數(shù)目的字符。
- split() 把字符串分割為字符串?dāng)?shù)組。
- indexOf() 檢索字符串,返回某個(gè)指定的字符串值在字符串中首次出現(xiàn)的位置。注意，如果查找不到會(huì)返回 -1
- lastIndexOf() 從后向前搜索字符串。
- toLowerCase() 把字符串轉(zhuǎn)換為小寫。
- toUpperCase() 把字符串轉(zhuǎn)換為大寫。
- match() 找到一個(gè)或多個(gè)正則表達(dá)式的匹配。(正則表達(dá)式后續(xù)課程會(huì)講)
該方法會(huì)返回一個(gè)數(shù)組，數(shù)組中包含了所有符合條件的文本。 - replace() 替換與正則表達(dá)式匹配的子串，并返回替換后的字符串，注意原字符串不會(huì)改變
- search() 檢索與正則表達(dá)式相匹配的值。查找與參數(shù)模式相匹配的文本，并返回該文本的位置。若無則返回null(indexOf()會(huì)返回-1).與indexOf()相似。
- ......
需要注意的是，JavaScript 的字符串是不可變的（immutable），String 類定義的方法都不能改變字符串的內(nèi)容。像 String.toUpperCase() 這樣的方法，返回的是全新的字符串，而不是修改原始字符串。
var str1 = "hello";
var str2 = new String("javascript");
document.write(str2.charAt(1)+'<br>');
document.write(str2.charCodeAt(1)+'<br>');
document.write(str2.concat('a')+'<br>');
瀏覽器對(duì)象BOM
基本概念
- BOM是Browser Object Model的縮寫，簡(jiǎn)稱瀏覽器對(duì)象模型
- BOM由一系列相關(guān)的對(duì)象構(gòu)成，并且每個(gè)對(duì)象都提供了很多方法與屬性
- 基本的BOM體系結(jié)構(gòu)圖
- 能利用BOM做什么？
BOM提供了一些訪問窗口對(duì)象的一些方法，我們可以用它來移動(dòng)窗口位置，改變窗口大小，打開新窗口和關(guān)閉窗口，彈出對(duì)話框，進(jìn)行導(dǎo)航以及獲取客戶的一些信息如：瀏覽器品牌版本，屏幕分辨率。但BOM最強(qiáng)大的功能是它提供了一個(gè)訪問HTML頁面的一入口——document對(duì)象，以使得我們可以通過這個(gè)入口來使用DOM的強(qiáng)大功能！！！
window對(duì)象的方法和屬性
window對(duì)象是瀏覽器窗口對(duì)文檔提供的一個(gè)現(xiàn)實(shí)的容器，代表打開的瀏覽器窗口，是每一個(gè)加載文檔的父對(duì)象
window的屬性和方法調(diào)用方法:window.屬性，window.方法 也可以直接調(diào)用省略 window.
-
對(duì)話框
- alert() 顯示帶有一段消息和一個(gè)確認(rèn)按鈕的警告框。
- confirm() 顯示可提示用戶輸入的對(duì)話框。返回值為布爾值
- prompt() 顯示帶有一段消息以及確認(rèn)按鈕和取消按鈕的對(duì)話框。
第一個(gè)參數(shù)是提示,第二個(gè)參數(shù)是默認(rèn)值;
返回值為輸入的值，取消返回null
-
窗體控制
- open() 打開一個(gè)新的瀏覽器窗口或查找一個(gè)已命名的窗口。
- URL:聲明了要在新窗口中顯示的文檔的 URL。
- name:聲明了新窗口的名稱或者窗口目標(biāo)。
- features:聲明了新窗口要顯示的標(biāo)準(zhǔn)瀏覽器的特征。
- 窗口的屬性：
- 常用：
- width:新建窗口寬度
- heigth:新建窗口高度
- top:左上角垂直坐標(biāo)
- left:左上角水平坐標(biāo)
- 其他不太常用的屬性：
- toolbar：指定窗口是否有標(biāo)準(zhǔn)工具欄。當(dāng)該選項(xiàng)的值為1或yes時(shí)，表示有標(biāo)準(zhǔn)工具欄，當(dāng)該選項(xiàng)的值為0或no時(shí)，表示沒有標(biāo)準(zhǔn)工具欄；
- resizable：指定窗口是否可改變大小，選項(xiàng)的值及含義與toolbar相同；
- ocation：指定窗口是否有地址工具欄，選項(xiàng)的值及含義與toolbar相同；
- directories：指定窗口是否有鏈接工具欄，選項(xiàng)的值及含義與toolbar相同；
- status：指定窗口是否有狀態(tài)欄，選項(xiàng)的值及含義與toolbar相同；
- menubar：指定窗口是否有菜單，選項(xiàng)的值及含義與toolbar相同；
- scrollbar：指定當(dāng)前窗口文檔大于窗口時(shí)是否有滾動(dòng)條，選項(xiàng)的值及含義與 toolbar相同；
- ........
- 常用：
- close() 關(guān)閉瀏覽器窗口。
- open() 打開一個(gè)新的瀏覽器窗口或查找一個(gè)已命名的窗口。
-
定時(shí)器
- setInterval() 按照指定的周期（以毫秒計(jì)）來調(diào)用函數(shù)或計(jì)算表達(dá)式。
- setTimeout() 在指定的毫秒數(shù)后調(diào)用函數(shù)或計(jì)算表達(dá)式。
- clearInterval() 取消由 setInterval() 設(shè)置的 timeout。
- clearTimeout() 取消由 setTimeout() 方法設(shè)置的 timeout。
var timeId = setTimeout(test,10); clearTimeout(timeId); -
其他方法
- print() 打印當(dāng)前窗口的內(nèi)容。
- blur() 把鍵盤焦點(diǎn)從頂層窗口移開。
- createPopup() 創(chuàng)建一個(gè) pop-up 窗口。
- focus() 把鍵盤焦點(diǎn)給予一個(gè)窗口。
- moveBy() 可相對(duì)窗口的當(dāng)前坐標(biāo)把它移動(dòng)指定的像素。
- moveTo() 把窗口的左上角移動(dòng)到一個(gè)指定的坐標(biāo)。
- resizeBy() 按照指定的像素調(diào)整窗口的大小。
- resizeTo() 把窗口的大小調(diào)整到指定的寬度和高度。
- scrollBy() 按照指定的像素值來滾動(dòng)內(nèi)容。
- scrollTo() 把內(nèi)容滾動(dòng)到指定的坐標(biāo)。
-
Window 對(duì)象屬性
- 掌握部分
- innerWidth 返回窗口的文檔顯示區(qū)的寬度。
- innerHeight 返回窗口的文檔顯示區(qū)的高度。
- 了解部分
- name 設(shè)置或返回窗口的名稱。
- opener 返回對(duì)創(chuàng)建此窗口的窗口的引用。
- closed 返回窗口是否已被關(guān)閉。
- self 返回對(duì)當(dāng)前窗口的引用。
- top 返回最頂層的先輩窗口。
- outerheight 返回窗口的外部高度。
- outerwidth 返回窗口的外部寬度。
- status 設(shè)置窗口狀態(tài)欄的文本。
- ......
- 掌握部分
History對(duì)象的常用方法
history對(duì)象有back和forward兩個(gè)方法，它可以跳轉(zhuǎn)到當(dāng)前頁的上一頁和下一頁，可以用length屬性查看客戶端瀏覽器的歷史列表中訪問的網(wǎng)頁個(gè)數(shù)
- back() 加載 history 列表中的前一個(gè) URL。
- forward() 加載 history 列表中的下一個(gè) URL。
- go() 加載 history 列表中的某個(gè)具體頁面。
Location 對(duì)象
- Location 對(duì)象的屬性
- href 設(shè)置或返回完整的 URL。
- host 設(shè)置或返回主機(jī)名和當(dāng)前 URL 的端口號(hào)。
- hash 設(shè)置或返回從井號(hào) (#) 開始的 URL（錨）。
- hostname 設(shè)置或返回當(dāng)前 URL 的主機(jī)名。
- pathname 設(shè)置或返回當(dāng)前 URL 的路徑部分。
- port 設(shè)置或返回當(dāng)前 URL 的端口號(hào)。
- protocol 設(shè)置或返回當(dāng)前 URL 的協(xié)議。
- search 設(shè)置或返回從問號(hào) (?) 開始的 URL（查詢部分）。
- Location 對(duì)象的方法
- assign() 加載新的文檔。
- reload() 重新加載當(dāng)前文檔。
如果該方法沒有規(guī)定參數(shù)，或者參數(shù)是 false，它就會(huì)用 HTTP 頭 If-Modified-Since 來檢測(cè)服務(wù)器上的文檔是否已改變。如果文檔已改變，reload() 會(huì)再次下載該文檔。如果文檔未改變，則該方法將從緩存中裝載文檔。這與用戶單擊瀏覽器的刷新按鈕的效果是完全一樣的。 如果把該方法的參數(shù)設(shè)置為 true，那么無論文檔的最后修改日期是什么，它都會(huì)繞過緩存，從服務(wù)器上重新下載該文檔。這與用戶在單擊瀏覽器的刷新按鈕時(shí)按住 Shift 健的效果是完全一樣。 - replace() 用新的文檔替換當(dāng)前文檔。
replace() 方法不會(huì)在 History 對(duì)象中生成一個(gè)新的記錄。當(dāng)使用該方法時(shí)，新的 URL 將覆蓋 History 對(duì)象中的當(dāng)前記錄。
Screen 對(duì)象
- availHeight 返回顯示屏幕的高度 (除 Windows 任務(wù)欄之外)。
- availWidth 返回顯示屏幕的寬度 (除 Windows 任務(wù)欄之外)。
- height 返回顯示屏幕的高度。
- width 返回顯示器屏幕的寬度。
- bufferDepth 設(shè)置或返回調(diào)色板的比特深度。
- ......
Navigator 對(duì)象屬性
- appCodeName 返回瀏覽器的代碼名。
- appMinorVersion 返回瀏覽器的次級(jí)版本。
- appName 返回瀏覽器的名稱。
- appVersion 返回瀏覽器的平臺(tái)和版本信息。
- cookieEnabled 返回指明瀏覽器中是否啟用 cookie 的布爾值。
- userAgent 返回由客戶機(jī)發(fā)送服務(wù)器的 user-agent 頭部的值
- onLine 返回指明系統(tǒng)是否處于脫機(jī)模式的布爾值。
- ......
// 動(dòng)態(tài)顯示時(shí)間
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
function clock() {
var today = new Date();
var hours = today.getHours();
var minutes = today.getMinutes();
var seconds = today.getSeconds();
var str = "現(xiàn)在時(shí)間："
if (hours < 12) {
str+='上午';
}else {
str+='下午';
}
str+=hours+'時(shí)'+minutes+'分'+seconds+'秒';
// document.write(str+'<br>')
var clock=document.getElementById('clock')
clock.value=str
}
setInterval('clock()',1000);
</script>
<input type="text" id="clock" size="40">
<input type="button" id="clock" size="40" value="停止時(shí)間" onclick="clearInterval(timeId) ">
</body>
</html>
// 比賽
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
var guojing=new Object();
guojing.name="郭靖"
guojing.HP=500;
guojing.gj=90;
guojing.sd=60;
guojing.skill=new Array('亢龍有悔','飛龍?jiān)谔?,'見龍?jiān)谔?,'鴻漸于陸','潛龍勿用')
var ouyang=new Object();
ouyang.name='歐陽鋒';
ouyang.HP=800;
ouyang.gj=100;
ouyang.sd=40;
ouyang.skill=new Array('靈蛇棍法','鳳凰神力','顛倒陰陽','逆轉(zhuǎn)靜脈','天蟾神功')
function whoGjwho(a,b) {
return a.sd*Math.random()>b.sd*Math.random()?[a,b]:[b,a];
}
function game() {
var skillIndex=Math.floor(Math.random()*5)
var fight = whoGjwho(guojing,ouyang);
var attacker = fight[0];
var defender = fight[1];
var damage=attacker.gj*Math.random()-defender.gj*Math.random();
if(damage<=0){
damage=0
}else{
damage=Math.ceil(damage);
}
defender.HP-=damage;
document.write(attacker.name+"使用了一招"+attacker.skill[skillIndex]+'<br>')
document.write(defender.name+"損失了"+damage+'點(diǎn)HP'+'<br>')
if (defender.HP>0) {
document.write(defender.name+"的HP:"+defender.HP+'<br>'+attacker.name+'的HP:'+attacker.HP+'<hr>')
}else{
document.write(defender.name+'戰(zhàn)敗了'+'<br>'+attacker.name+'取得了勝利！'+'<br>')
alert(attacker.name+'取得了勝利！'+'Gmame Over!')
clearInterval(zd)
}
}
var zd=setInterval('game()',50)
</script>
</body>
</html>
