# window對象(瀏覽器對象模型) #
---------------
window對象表示在瀏覽器中打開的窗口, 它是JavaScript瀏覽器對象模型中的頂層對象.其中還包括了:
. Document: 使咱們能夠從腳本中對 HTML 頁面中的全部元素進行訪問。
. History: 包含用戶(在瀏覽器窗口中)訪問過的 URL。
. Location: 包含有關當前 URL 的信息。
. Navigator: 包含有關瀏覽器的信息。
. Screen: 包含有關客戶端顯示屏幕的信息。
說明:
1. 說有瀏覽器都支持 window 對象。它表示瀏覽器窗口。
2. 全部 JavaScript 全局對象、函數以及變量均自動成爲 window 對象的成員。
3. 全局變量是 window 對象的屬性。
4. 全局函數是 window 對象的方法。
#### 1. window對象 ####
#### 1.1 位置 ####
方法 描述
screenX 返回相對於屏幕窗口的x座標(IE不支持)
screenY 返回相對於屏幕窗口的y座標(IE不支持,距離瀏覽器最頂端)
screenLeft 返回相對於屏幕窗口的x座標
screenTop 返回相對於屏幕窗口的y座標(在IE中包括工具欄+菜單欄+地址欄)
#### 1.2 窗口大小 ####
方法 描述
window.innerWidth 返回窗口的文檔顯示區的寬度。(IE不支持)
window.innerHeight 返回窗口的文檔顯示區的高度。(IE不支持)
document.documentElement.clientWidth 返回窗口的文檔顯示區的寬度。(通用方法)
document.documentElement.clientHeight 返回窗口的文檔顯示區的高度。(通用方法)
## 2. window對象的方法 ##
#### 2.1 窗體的移動和尺寸(僅IE有效) ####
方法 描述
window.moveBy(x, y) 可相對窗口的當前座標把它移動指定的像素。
window.moveTo(x, y) 把窗口的左上角移動到一個指定的座標。
window.resizeBy(x, y) 按照指定的像素相對的調整窗口的大小。
window.resizeTo(x, y) 把窗口的大小調整到指定的寬度和高度。
#### 2.2 滾動條的控制 ####
示例: 滾動條移動
方法 描述
window.scrollBy(x, y) 相對於當前滾動條的位置移動
window.scrollTo(x, y) 把內容滾動到指定的座標。
#### 2.3 時間間隔函數(計時器) ####
方法 描述
window.setInterval(code, millisec) 按照指定的週期(以毫秒計)來調用函數或計算表達式。
window.clearInterval(obj) 取消由 setInterval() 設置的 timeout。
window.setTimeout(code, millisec) 在指定的毫秒數後調用函數或計算表達式。
window.clearTimeout(obj) 取消由 setTimeout() 方法設置的 timeout。
#### 2.4 打開新窗口 ####
window.open(URL,name,specs,replace)
參數說明:http://www.runoob.com/jsref/met-win-open.html
#### 2. history對象 ####
包含用戶(在瀏覽器窗口中)訪問過的 URL。
#### 2.1 屬性 ####
屬性 描述
length 返回歷史列表中的網址數
#### 2.2 方法 ####
方法 描述
history.back() 加載歷史列表中的前一個 URL(若是存在),調用該方法的效果等價於點擊後退按鈕或調用history.go(-1)
history.forward() 加載歷史列表中的下一個 URL。調用該方法的效果等價於點擊前進按鈕或調用 history.go(1)。
history.go(number|URL) 加載歷史列表中的某個具體的頁面
## 3. location對象 ##
包含有關當前 URL 的信息。
#### 3.1 屬性 ####
屬性 描述
href 返回完整的URL
hostname 返回URL的主機名
pathname 返回的URL路徑名
port 返回一個URL服務器使用的端口號
search 返回一個URL的查詢部分
#### 3.2 方法 ####
方法 描述
location.assign(URL) 加載一個新的文檔
location.reload() 用於刷新當前文檔
location.replace(newURL) 用一個新文檔取代當前文檔(沒有歷史記錄)
示例:等待3秒跳轉
## 4. screen對象 ##
包含有關客戶端顯示屏幕的信息。
#### 4.1 屬性 ####
屬性 描述
availHeight 返回屏幕的高度(不包括Windows任務欄)
availWidth 返回屏幕的寬度(不包括Windows任務欄)
width 返回屏幕的總寬度
height 返回屏幕的總高度
## 5. Navigator 對象 ##
對象包含有關瀏覽器的信息
#### 5.1 屬性 ####
屬性 描述
appCodeName 返回瀏覽器的代碼名
appName 返回瀏覽器的名稱
appVersion 返回瀏覽器的平臺和版本信息
platform 返回運行瀏覽器的操做系統平臺javascript
總結
語法:
條件判斷1:
1. if語句
語法:
if(表達式1){
表達式2;
}
表達式3;
.程序判斷表達式1,成立執行表達式2,不成立執行表達式3
2. if...else... 語句
語法:
if(表達式1){
表達式2;
}
表達式3;
.程序判斷表達式1,成立執行表達式2,不成立執行表達式3
2. if...else... 語句
語法:
if(表達式1) {
表達式2;
} else {
表達式3;
}
表達式4;
說明: 程序判斷表達式1,成立執行表達式2,不成立執行表達式3,再執行表達式4
3. if...else if..
if(表達式1) {
表達式2;
} else if(表達式3) {
表達式4;
} else if(表達式5) {
表達式6;
} else {
表達式7;
}
表達式8;
4. 嵌套使用
if(表達式1) { //區塊1
if(表達式2) { //區塊2
表達式3;
}
表達式4;
}
表達式5;
說明:
1. 程序判斷表達式1,不成立執行表達式5,成立進入區塊1;
2. 進入區塊1,判斷表達式2,成立執行表達式3,不然執行表達式4;
5. switch結構
var a = 1;
switch(a) {
case 1 :
console.log(1);
break;
case 2 :
console.log(2);
break;
case 3 :
console.log(3);
break;
default :
console.log("default");
}
說明: ...break:...跳出控制語句;...default:...當全部...case...都不匹配時執行...default...;
循環語句
循環語句用於重複執行某個操做,它有許多種形式。
1. while循環
while(表達式1) {
表達式2;
}
表達式3;
>說明:首先判斷表達式1,成立執行表達式2,而後繼續判斷表達式1,若是不成立執行表達式3
2. do...while...循環
do {
表達式1;
} while(表達式2);
表達式3;
說明:先執行表達式1,在判斷表達式2,若是成立,繼續執行表達式1,不成立執行表達式3;
3. for循環
for語句是循環命令的另外一種形式,它分紅三步:
初始化(initialize):肯定循環的初始值,只在循環開始時執行一次;
測試(test):檢查循環條件,只要爲真就進行後續操做;
遞增(increment):完成後續操做,而後返回上一步,再一次檢查循環條件。
語義:
for(初始化;測試;遞增) {}
執行流程:
for(表達式1;表達式2;表達式3) {
表達式4;
}
表達式5;
>說明:首先執行表達式1,再判斷表達式2,若是表達式2成立,則執行表達式4,再執行表達式3,再判斷表達式2,不成立的話執行表達式5;
break語句和continue語句
- break語句用於跳出代碼塊或循環。
- continue語句用於當即終止本次循環,返回循環結構的頭部,開始下一次循環html
**# 總結** #
----------------------
# 函數 #
----------
## 1. 函數的聲明 ##
#### 1.1 關鍵字 function ####
函數就是使用function命令命名的代碼區塊,便於反覆調用。function命令後面是函數名,函數名後面是一對圓括號,裏面是傳入函數的參數。函
數體放在大括號裏面。
//函數的聲明
function test() {
//方法體
}
#### #1.2 函數表達式 # ####
除了用function命令聲明函數,還能夠採用變量賦值的寫法。
//函數表達式
var test = function() {
//方法體
}
說明:
1.採用函數表達式聲明函數時,function命令後面不帶有函數名。
2.函數的表達式須要在語句的結尾加上分號,表示語句結束。而函數的聲明在結尾的大括號後面不用加分號。總的來講,這兩種聲
明函數的方式,差異很細微(變量提高),這裏能夠近似認爲是等價的。
#### ## 1.3 Function構造函數 ## ####
經過Function構造函數聲明。總的來講,這種聲明函數的方式很是不直觀,幾乎無人使用。
var add = new Function("x", "y", "return x + y");
console.log(add(1, 2));
#### 1.4 函數的重複聲明 ####
若是屢次採用function命令,重複聲明同一個函數,則後面的聲明會覆蓋前面的聲明。
function f(){
console.log(1);
}
f(); // 2
function f(){
console.log(2);
}
f(); // 2
#### 2. 形式參數和return語句 ####
調用函數時,要使用圓括號運算符。圓括號之中,能夠加入函數的參數。
function add(x,y) {
return x+y;
}
add(1,1) // 2
## 3. 當即調用的函數表達式(IIFE(Immediately-Invoked Function Expression)) ##
有時,咱們須要在定義函數以後,當即調用該函數。這時,你不能在函數的定義以後加上圓括號,這會產生語法錯誤。產生這個錯誤的緣由
是,Javascript引擎看到function關鍵字以後,認爲後面跟的是函數定義語句,不該該以圓括號結尾。
function(){ /* code */ }();
// SyntaxError: Unexpected token (
解決方法: 圓括號前面的部分不是函數定義語句,而是一個表達式,能夠對此進行運算。
(function(){ /* code */ }());
// 或者
(function(){ /* code */ })();
注意,上面的兩種寫法的結尾,都必須加上分號。
## 4. 第一等公民 ##
JavaScript的函數與其餘數據類型處於同等地位,可使用其餘數據類型的地方就能使用函數。好比,能夠把函數賦值給變量和對象的屬性,也
能夠看成參數傳入其餘函數,或者做爲函數的結果返回。這表示函數與其餘數據類型的地方是平等,因此又稱函數爲第一等公民。
function add(x, y) {
return x + y;
}
// 將函數賦值給一個變量
var fn = add;
console.log(fn(1, 2));
// 將函數做爲參數和返回值
function operator(fn) {
return fn;
}
console.log(operator(add)(1, 2));
## 5. 函數名的提高 ##
JavaScript引擎將函數名視同變量名,因此採用function命令聲明函數時,整個函數會被提高到代碼頭部。因此,下面的代碼不會報錯。
var sum = add(1, 2);
console.log(sum);
function add(x, y) {
return x + y;
}
表面上,上面代碼好像在聲明以前就調用了函數add。可是實際上,因爲「變量提高」,函數f被提高到了代碼頭部,也就是在調用之
前已經聲明瞭。可是,若是採用賦值語句定義函數,JavaScript就會報錯。
var sum = add(1, 2);
console.log(sum);
var add = function (x, y) {
return x + y;
}
//Uncaught TypeError: add is not a function
若是同時採用function命令和賦值語句聲明同一個函數,最後老是採用賦值語句的定義。
var fn = function() {
console.log ("1");
};
function fn() {
console.log("2");
}
fn();
// 1
## 6. 函數的屬性和方法 ##
#### 6.1 name屬性:返回緊跟在function關鍵字以後的那個函數名。 ####
function fn1() {}
console.log(fn1.name);
var fn2 = function() {};
console.log(fn2.name);
var fn3 = function fn3() {};
console.log(fn3.name);
#### 6.2 length屬性:返回函數定義中參數的個數。 ####
function fn(x, y) {}
console.log(fn.length);
7. 函數做用域
7.1 定義
做用域(scope)指的是變量存在的範圍。Javascript只有兩種做用域:一種是全局做用域,變量在整個程序中一直存在;另外一種是函數做用域,
變量只在函數內部存在。
(1) 在函數外部聲明的變量就是全局變量(global variable),它能夠在函數內部讀取。
(2) 在函數內部定義的變量,外部沒法讀取,稱爲「局部變量」(local variable)。
(3) 函數內部定義的變量,會在該做用域內覆蓋同名全局變量。
7.2 函數內部的變量提高
與全局做用域同樣,函數做用域內部也會產生「變量提高」現象。var命令聲明的變量,無論在什麼位置,變量聲明都會被提高到函數體的頭部。
7.3 函數自己的做用域
函數自己也是一個值,也有本身的做用域。它的做用域綁定其聲明時所在的做用域。
var a = 1;
var fn = function() {
console.log(a);
};
function fn1() {
var a = 2;
fn();
}
fn1(); //1
### 8. 參數 ###
#### 8.1 概述 ####
函數運行的時候,有時須要提供外部數據,不一樣的外部數據會獲得不一樣的結果,這種外部數據就叫參數。
function square(x) {
return x * x;
}
square(2); //4
square(3); //9
8.2 傳遞方式
JavaScript的函數參數傳遞方式是傳值傳遞(passes by value),這意味着,在函數體內修改參數值,不會影響到函數外部。
//原始數據類型
var a = 1;
function fn(a) {
a = 3;
}
fn(a);
console.log(a); //1
//引用類型
var arr = [1, 2, 3];
function fn1(arr) {
arr = [4, 5, 6];
}
fn1(arr);
console.log(arr); //[1, 2, 3]
注意 , 雖然參數自己是傳值傳遞,可是對於複合類型的變量來講,屬性值是傳址傳遞(pass by reference),也就是說,屬性值是經過
地址讀取的。因此在函數體內修改複合類型變量的屬性值,會影響到函數外部。
//修改對象的屬性值
var obj = {
attr : 1
};
function fn(obj) {
obj.attr = 2;
}
console.log(obj.attr);
//修改數組的元素值
var arr = [1, 2, 3];
function fn(arr) {
arr[0] = 4;
arr[1] = 5;
arr[2] = 6;
}
fn(arr);
console.log(arr.toString());
#### 8.3 arguments對象 ####
1) 因爲JavaScript容許函數有不定數目的參數,因此咱們須要一種機制,能夠在函數體內部讀取全部參數。這就是arguments對象的由來。
2) arguments對象包含了函數運行時的全部參數,arguments[0]就是第一個參數,arguments[1]就是第二個參數,依次類推。這個對象只有在函
數體內部,纔可使用。
3) 能夠經過arguments對象的length屬性,判斷函數調用時到底帶幾個參數。
語法
function.apply(thisobj, args)
參數
thisobj
調用function的對象。在函數主體中,thisobj是關鍵字this的值。
args
一個數組,它的元素是要傳遞給函數function的參數值。
返回值
調用函數function的返回值。
拋出
TypeError
若是調用該函數的對象不是函數,或參數args不是數組和Arguments對象,則拋出該異常。
描述
apply()將指定的函數function做爲對象thisobj的方法來調用,傳遞給它的是存放在數組args中的參數,返回的是調用function的返回值。在函數體內,關鍵字this引用thisobj對象。
參數args必須是數組或Arguments對象。若是想單獨指定傳遞給函數的參數,而不是指定數組元素,請使用Function.call()方法。
示例
// 在對象上應用默認的Object.toString()方法,
/ /該對象用該方法的版本覆蓋了它。注意,沒有參數
Object.prototype.toString.apply(o);
//使用數組中用來查找最大元素的方法來調用Math.max()
// 注意本例中第一個參數沒有什麼做用
var data = [1,2,3,4,5,6,7,8];
Math.max.apply(null, data);
// function add(a,b){
// return a+b;
// }
//console.log(add(1,2));
//
//function saysomething(){
//console.log("hello world!!")
# ATM #
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ATM</title>
<script type="text/javascript">
var users=[
["王海建","123456",1000],
["王建","111111",2000]
];
var username=window.prompt("請輸入用戶名:");
var password=window.prompt("請輸入密碼:");
var userIndex = isLogin(username,password);
operation(userIndex);
function save(user){
var money = parseInt(window.prompt("請輸入存款金額:"));
user[2] += money;
console.log("操做成功!!")
}
function getMoney(user){
var money = parseInt(window.prompt("請輸入取款金額:"));
user[2] -= money;
console.log("操做成功!!")
}
function operation(userIndex){
var flag = true;
while (flag){
var option=window.prompt("一、存款 二、取款 三、查詢 四、退出");
switch(option){
case"1":
save(users[userIndex]);
console.log("1");
break;
case"2":
getMoney(users[userIndex]);
console.log("2");
break;
case"3":
console.log("餘額:" + users[userIndex][2]);
break;
default:
flag = false;
}
}
}
function isLogin(username,password){
for(var i=0;i<users.length;i++){
if(username == users[i][0]&&password ==users[i][1]){
return i;
}
}
return -1;
}
</script>
</head>
<body>
</body>
</html>java
**### 總結 ###**
-
----------
冒泡排序(Bubble Sort
-
冒泡排序(Bubble Sort),是一種計算機科學領域的較簡單的排序算法。
它重複地走訪過要排序的數列,一次比較兩個元素,若是他們的順序錯誤就把他們交換過來。走訪數列的工做是重複地進行直到沒有再須要交換,也就是說該數列已經排序完成。</br>
這個算法的名字由來是由於越大的元素會經由交換慢慢「浮」到數列的頂端,故名。</br>
1.
冒泡排序算法的運做以下:(從後往前)</br>
1. 比較相鄰的元素。若是第一個比第二個大,就交換他們兩個。</br>
2. 對每一對相鄰元素做一樣的工做,從開始第一對到結尾的最後一對。在這一點,最後的元素應該會是最大的數。</br>
3. 針對全部的元素重複以上的步驟,除了最後一個。</br>
4. 持續每次對愈來愈少的元素重複上面的步驟,直到沒有任何一對數字須要比較。</br>
function bubbleSort(arr) {
var i = arr.length, j;
var tempexchangval;
while (i > 0) {
for (j = 0; j < i - 1; j++) {
if (arr[j] > arr[j + 1]) {
tempexchangval = arr[j];
arr[j] = arr[j + 1];
arr[j + 1] = tempexchangval;
}
}
i--;
}
return arr;
}
var arr = [3, 2, 4, 9, 1, 5, 7, 6, 8];
var arrSorted = bubbleSort(arr);
console.log(arrSorted);
alert(arrSorted);
# 控制檯將輸出:[1, 2, 3, 4, 5, 6, 7, 8, 9]
而且彈窗; #
**
JS 索引數組、關聯數組和靜態數組、動態數組 **
-
數組分類:</br>
一、從數組的下標分爲索引數組、關聯數組 </br>
/* 索引數組,即一般狀況下所說的數組 */</br>
var ary1 = [1,3,5,8];</br>
//按索引去取數組元素,從0開始(固然某些語言實現從1開始)</br>
//索引實際上就是序數,一個整型數字</br>
alert(ary1[0]);
alert(ary1[1]);
alert(ary1[2]);
alert(ary1[3]);
/* 關聯數組,指以非序數類型爲下標來存取的數組 python中稱爲字典</br> */
var ary2 = {};
//存取時,以非序數(數字),這裏是字符串</br>
ary2["one"] = 1;
ary2["two"] = 2;
ary2["thr"] = 3;
ary2["fou"] = 4;
二、從對數據的存儲分爲靜態數組、動態數組 </br>
/* java中的靜態數組 */ Int[] ary1 = {1,3,6,9};//定義後數組的長度固定了不能改變,按索引取數組元素 /* java中的動態數組 (java中的ArrayList實現是以Array爲基礎的,這裏說動態數組是廣義的,無論採用什麼方式實現。不要較勁) */ List<Integer> ary2 = new ArrayList<Integer>(); ary2.add(1);//能夠動態的添加元素,數組的長度也隨着變化 ary2.add(3); ary2.add(6); </br>
/* js的數組屬於動態數組 */</br>
var ary = [];//定義一個數組,未指定長度
ary[0] = 1;//能夠動態的添加元素
ary.push(3);
ary.push(5);
alert(ary.join(","));//輸出1,3,5
js的數組同時屬於索引數組和動態數組,由於本質上它就是一個js對象,體現着js動態語言特性。但js的索引數組並不是「連續分配」內存的,所以索引方式並不會帶來很高的效率。而Java中的數組則是連續分配內存的。</br>
Array 對象sort 方法</br>
描述:
返回一個元素已經進行了排序的 Array 對象.</br>
語法:
sort() 默認對 字符傳進行排序.</br>
arrayobj.sort(sortfunction)
如要求結果是十、1六、120這樣的數字大小排序,應該使用下面的程序:</br>
<SCRIPT language=JavaScript>
var a=new Array(3);
a[0]=10;
a[1]=16;
a[2]=120;
a.sort(function(x,y){return parseInt(x)-parseInt(y);});
document.write(a+" ");
</SCRIPT>
function(x,y)是具體實現排序功能的函數, 上面的方法是實現升序,若是想實現降序,能夠改下返回結果:return parseInt(y)-parseInt(x);</br>
固然若是想實現字符串的排序,則能夠直接使用a.sort(param);即sort(param) 默認對字符串進行排序,參數爲一函數,若是省略該參數,則那麼元素將按照 ASCII 字符順序進行升序排列.固然也能夠實現對Long型數據排序,將parseInt改成parseLong便可.</br>
冒泡排序的原理是這樣的,比方說有五個數字54321,要按從小到大排列;</br>
首先比較前兩個,就是5和4,若是第一個小於第二個,不作操做,若是第一個大於第二個,那麼交換兩者的位置,即變成45321,而後比較第二個和第三個,交換位置,變成43521,而後第三個和第四個,第四個和第五個,這樣一次循環下來,變成43215</br>
因此,一層循環的效果就是挑出最大的一個數字5,冒泡到最後面。可是還要挑出第二大,第三大的數字,等等。因此一層循環根本就不夠用,必須再套一層才行。像這個例子,五個數字,起碼要進行四輪循環才行。至於爲何要this.length-i,是由於第一次比較五個數字,第二個只要比較前四個就好了,第五個確定是最大的了。。</br>
var array = [5, 4, 3, 2, 1];
var temp = 0;
for (var i = 0; i < array.length; i++)
{
for (var j = 0; j < array.length - i; j++)
{
if (array[j] > array[j + 1])
{
temp = array[j + 1];
array[j + 1] = array[j];
array[j] = temp;
}
}
}
console.log(array);
**1.概述**
-
Array是JavaScript的內置對象,同時也是一個構造函數,能夠用它生成新的數組。
做爲構造函數時,Array能夠接受參數,可是不一樣的參數,會使得Array產生不一樣的行爲。
-
new Array(1); 返回length爲1的空數組;
new Array(1, 2);
2. 靜態方法
-
-
isArray方法: 用來判斷一個值是否爲數組。它能夠彌補typeof運算符的不足。
-
var a = [1, 2, 3];
typeof a // "object"
Array.isArray(a) // true
上面代碼表示,typeof運算符只能顯示數組的類型是Object,而Array.isArray方法能夠對數組返回true。
-
3. Array實例的方法
-
-
valueOf: valueOf方法返回數組自己。
-
-
toString: 返回數組的字符串形式。
-
-
var a = [1, 2, 3];
a.toString() // "1,2,3"
var a = [1, 2, 3, [4, 5, 6]];
a.toString() // "1,2,3,4,5,6"
push: 用於在數組的末端添加一個或多個元素,並返回添加後的數組的長度。
-
var a = [];
a.push(1) // 1
a.push('a') // 2
a.push(true, {}) // 4
a // [1, 'a', true, {}]
pop: 用於刪除數組的最後一個元素,並返回該元素。
-
var a = ['a', 'b', 'c'];
a.pop() // 'c'
a // ['a', 'b']
join: 以參數做爲分隔符,將全部數組成員組成一個字符串返回。
-
var a = [1, 2, 3, 4];
a.join() // "1,2,3,4"
a.join('') // '1234'
a.join("|") // "1|2|3|4"
concat: 用於多個數組的合併。它將新數組的成員,添加到原數組的尾部,而後返回一個新數組。
-
['hello'].concat(['world'])
// ["hello", "world"]
['hello'].concat(['world'], ['!'])
// ["hello", "world", "!"]
[1, 2, 3].concat(4, 5, 6)
// [1, 2, 3, 4, 5, 6]
shift: 用於刪除數組的第一個元素,並返回該元素。
-
var a = ['a', 'b', 'c'];
a.shift() // 'a'
a // ['b', 'c']
shift: 能夠遍歷並清空一個數組。
-
var list = [1,2,3,4,5,6,7,8,9,10];
var item;
while (item = list.shift()) {
console.log(item);
}
list // []
unshift: 用於在數組的第一個位置添加元素,並返回添加新元素後的數組長度。
-
var a = ['a', 'b', 'c'];
a.unshift('x'); // 4
a // ['x', 'a', 'b', 'c']
reverse: 用於顛倒數組中元素的順序,使用這個方法之後,返回改變後的原數組。
-