1. 程式人生 > >JavaScript學習筆記<1>

JavaScript學習筆記<1>

str 否則 a標簽 比較運算 table 函數 函數功能 滿足 isnan

JavaScript學習
1,JavaScript初識(js)
用途:數據驗證,將動態內容寫到網頁中(ajax)
可以對事件作出相應,讀取html中的內容,檢測瀏覽器版本,模擬動畫
讓網頁更加生動活潑。
2,JavaScript語法特點
基於對象 和 事件驅動 的 松散型的 解釋性 語言
面向對象開發、事件驅動、松散型 弱類型、解釋型語言,由瀏覽器解釋執行
ECMAscript(語法)
數據類型、運算符、流程控制、函數、面向對象
BOM(瀏覽器對象模型)
DOM(文檔對象模型)
3,js代碼的書寫方式
嵌入式:寫在head標簽裏,
<script type="text/javascript">
alert(‘學習‘);


</script>
引入外部js文件:創建js文件,在文件裏直接寫js代碼,不需要寫script標簽
在html文件裏引入js文件格式<script src="exm.js"></script>
如果script標簽是用來引入js文件的,那麽這個script標簽中就不能寫任何js代碼
重定向:類比a標簽來記,也可以寫在form裏
<a href="javascript:alert(‘123‘);">點擊</a>
<form action="javascript:alert(‘123‘);">
<input type="submit">

</form>
4,js四種輸出工具
alert();彈窗。內容會以文本的原格式輸出
document.write();將內容輸出到頁面,會以html的語法解析裏面的內容
prompt(‘提示文字‘,‘默認值‘);輸入框
console.log();將內容輸出到控制臺
5,js註釋及分號用法
註釋 ctr+? /* .... */ // 三種註釋方式
分號 分號表示一段功能體的結束 如果有換行可以不加分號 能加分號一定加分號
6,變量的多種創建方式
變量:可以存儲數據的一個容器,可以存儲和引用任何數據
變量的創建,一般以“var”關鍵字修飾
先聲明,後賦值,變量調用
var xy; xy=‘asdf‘; document.write(xy);

聲明和賦值同時進行
var xy=‘asdf‘; alter(xy);
同時創建多個變量,然後賦值
var xy wx xw;
xy=‘qwe‘; wx=‘er‘; xw=‘fg‘;
同時創建多個變量並且賦值、調用
var xy=‘qwe‘, wx=‘er‘,xw=‘fg‘; document.write(url);
7,變量的命名規範
嚴格區分大小寫、必須以字母或_或$開頭,余下的部分可以是任意字母數字,或_或$(數字不可以開頭)
不能用關鍵字或者是保留字命名,命名要有意義,駝峰命名法。
如果變量被重新聲明但沒有重新賦值,變量的值保持不變
如果變量重新聲明並重新賦值,變量原來的值被覆蓋
8,數據類型
檢測變量的數據類型 格式
var xy;
//檢測xy變量的數據類型
var type = typeof xy;
document.write(xy);
Undefined: 如果變量被聲明,但是沒有被賦值,那麽就是Undefined類型
Null:什麽都沒有
字符串:所有被引號標記的數據都叫字符串,在js中單引號,雙引號沒有區別
數值類型:整型 浮點型
布爾值: 真true 假false (真假運算)
對象: object(class)
9,字符串拼接
將變量寫在字符串中
將變量左右兩邊各切一刀,將變量左右兩邊變成完整的字符串
將變量和左右字符串用加號連接
var name = prompt(‘請輸入你的姓名‘);
document.write(‘親愛的用戶‘+name+‘你好,歡迎登陸!‘);
10,算數運算符
算數運算符:+ - * / % ++ --
加號兩邊都是數字表示加法運算;兩邊有任何一邊為字符串,為字符串連接
減法,乘法,除法,會進行自動類型轉換
取余,取余數
如果++在變量後面,比較無私,先參與運算,本身再自增;如果++在前,比較自私,先自增,再參與運算。--道理相同
11,關系運算符(比較運算符)
結果為布爾值 真或假
==只判斷內容,不管類型;===全等,既判斷內容又判斷類型
!=只判斷內容,不管類型;!==既判斷內容又判斷類型
關系運算符會自動對兩邊的數據進行類型轉換
會進行類型轉換的運算符:==、> 、 < 、>= 、<= 、!=
不會進行類型轉換的運算符:!== 、 ===
12,賦值運算符
等號= a=a+2 a+=2(+可以換成- * / %)
13,邏輯運算符
與and && 運算符兩邊只要有一個假的,運算結果就是假的,只有兩邊為真才是真
或or || 兩邊只要有一邊為真,結果就為真
非not !取反 假變真 真變假
14,三元運算符
三元表達式:根據表達式的計算結果有條件的為變量賦值
(條件)?條件為真的時候返回的值:條件為假的時候返回的值
var age = prompt("請輸入你的年齡");
var hd=(age>=18)?‘成年人‘:‘未成年小朋友‘;
document.write(hd);
15,if判斷
選擇結構(分支判斷、條件判斷) 根據給定的條件有選擇的執行相應的流程結構
單路分支if{} 雙路分支 if{} else {} 多路分支 if{} else if{} else if {} 嵌套分支if{if{}}
16,switch判斷
switch如果判斷成功,會執行對應的代碼,而他後面的判斷不再執行
case判斷的時候,要求所對比的數據和待對比的值,內容和類型一樣
對比不成功時,默認default
17,自定義運算效果
<script type="text/javascript">
var x = prompt(‘請輸入第一個數字‘)*1; 註:乘1是因為在進行加法運算時,會默認兩個字符串連接,所以轉換成數值類型
var charset = prompt(‘請輸入運算符 + - * /‘);
var y = prompt(‘請輸入第二個數字‘)*1;
switch(charset){
case‘+‘:
var result = x+y;
break;
case ‘-‘:
var result=x-y;
break;
case ‘*‘:
var result=x*y;
break;
case‘/‘:
var result=x/y;
break;
default:
var result = ‘你輸入的有誤‘;
}
document.write(result);
</script>
18,for循環
當滿足一定條件時,重復執行某項操作
for(定義計數器;成立條件;計數器變化){ 循環體代碼 }
循環結構一定要有結尾,不能寫死循環
19,雙層for循環
裏外循環的計數器變量不能重名
20,直角三角形效果
for(var i=0;i<5;i++) {
for(var j=0;j<=i;j++) {
document.write("心");
}
document.write("<br />");
}
外層循環控制輸出幾行,裏層循環控制每行輸出幾個
21,九九乘法表的實現
for(var i=1;i<=9;i++){
for(var j=1;j<=i;j++){
document.write(j+"*"+i+"="+i*j+"&nbsp;&nbsp;&nbsp");
}
document.write("<br />");
}
22,自定義行數列數 隔行變色的表格
快捷鍵,創建三行四列的表格tr*3>td{學習}*4-----table鍵
在js文件裏創建表格方式:在document.write()裏加入表格
js的字符串不能換行
23,while循環
一般不指定具體的次數,要有結尾,否則就是死循環
先判斷,後執行
var age=18;
while(age<=50){
document.write(age+"歲領10塊錢<br />");
age ++;
}
24,do while循環 break和continue
先執行一次,後判斷
continue:跳出本次循環體後續代碼,直接進入下次循環判斷
break:直接結束本次循環,整個while循環停掉
25,函數的創建
函數是將完成某一個特定功能的代碼集合起來,可以重復使用的代碼塊。函數相當於一個工廠
用function聲明函數
function 函數名([參數1],[參數2]...){
函數體
[return] //返回值
}
函數裏面的代碼,在被調用的時候才會執行
調用函數/運行函數/執行函數
函數名.(); //需要幾個調用幾個
字面量形式聲明函數,使用var
26,帶參數的函數
明確函數的功能;聲明函數;分析需要的參數;構建函數功能流程。
創建函數時,沒有實際參數值的是形參
調用函數時傳入的 有實際值的函數時實參。
如果實參個數比形參多,多余的參數會被忽略
如果實參個數少於形參,沒有被復制的形參,默認值為undefined
NaN : not a number
27,函數return返回值
越權函數:函數擁有本不應該屬於它的權利。
一般來講,函數的結果要用return返回回來,函數在執行中如果遇到return,表示函數結束,後續代碼不會執行
28,變量的作用域
局部變量:在函數內部,用var聲明的變量。兩個條件缺一不可
全局變量:不是局部變量就一定是全局變量。
29,Number函數
轉換為數值類型
var result = Number(‘123‘); //將字符串123轉換為數值123
如果是布爾值,false轉為0,true轉為1;如果是數字轉換為本身,將無意義的後導0去掉;
如果是undefined轉換為NaN;如果是空字符轉換為0;
30,parseInt parseFloat函數
parseFloat();將數據轉換為小數
如果字符串是一個有效的整數,他返回的是整數,不會返回浮點數
parseInt();將字符串轉換為整形,提取出整數
第二個參數表示第一個參數的進制
var result = parseFloat(123,8); //將八進制的123轉換為十進制的123
31,isNaN eval函數
isNaN(); 用來判斷數據是否不能轉成數字。不能返回真true ,能返回假false
var result = isNaN(‘123‘);
eval(); 用js語法解析字符串的內容
32,數組的創建
一種數據的形式, 數組裏每一個數據都是獨立的,每個數據可以是任意合法類型。
數組中下標從0開始,數組是數據存儲方式,其數據對象類型是object。
數組可以先創建再復制。
通過構造函數創建數組
33,數組的遍歷
數組有個屬性length 數組名.length 可以往數組中添加元素
使用for循環,遍歷數組元素。
34,二維數組的創建和遍歷
大數組裏面套小數組
遍歷二維數組使用for循環
35,獲得數組最大值
function max(arr){
var x = arr[0];
//循環數組
for (var i =0;i<arr.length;i++) {
if(arr[i]>x){ //如果arr[i]>x,就讓x存儲arr[i]的值
x=arr[i];
}
}
return x;
}
36,獲得二維數組中長度最大的子數組序號
function max(arr){
var x = 0;//x用來存儲長度最長的子數組序號
for (var i =0;i<arr.length;i++) {
if(arr[i].length>arr[x].length){
x=i;
}
}
return x;
}

JavaScript學習筆記<1>