JavaScript核心語法
阿新 • • 發佈：2018-11-08
JavaScript核心語法
JavaScript核心語法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> </body> <script type="text/javascript"> //1.變數的宣告和賦值 var width=20; x=10; var y=1,z=2; // 只給了y賦值 var x,y,z=10; var st="ada"; var bo=true; // 資料型別（typeof(值) --此方法判斷型別） // 1.基本型別 // undefined(未定義) var width沒有賦值 document.write("width："+typeof(width)+"<br/>" ); // null(空型別 ,給變數賦予了一個空值) document.write(undefined + "<br/>");//true // number(數值型別) document.write("z:"+typeof(z)+"<br/>" );//number // String(字串型別) document.write("st:"+typeof(st)+"<br/>" );//string // boolean(布林型別) document.write("bo:"+typeof(bo)+"<br/>" );//boolean // 2.引用型別 // 物件，函式，陣列 var date=new Date(); document.write("date："+typeof (date)+"<br/>") //Object // Null型別 document.write("null："+typeof (null)+"<br/>") //Object </script> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> </body> <script type="text/javascript"> // String型別 :indexof() charAt(index) subString(index1,index2) split(str) var str="this is a String"; var one="a"; document.write(str.length+"<br\>");//16 // 陣列 var friut=new Array(3); friut[0]="apple"; friut[1]="orange"; friut[2]="banana"; var friut1=new Array("apple","orange","banana"); var friut2=["apple","orange","banana"]; // 遍歷陣列 for(var i=0;i<friut.length;i++){ document.write(friut[i]+" ") } for(var j in friut){ document.write(friut[j]+" ") } var str=friut.join("-"); document.write(str+"<br\>"); // push新增元素 返回陣列新的長度 var size= friut.push("peach") document.write(size+"<br\>");//4 </script> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> </body> <script type="text/javascript"> // 運算子 // 算術運算子：+ - * / % ++ -- // 比較運算子: < > <= >= == != === !== //==只判斷值 ，不看型別 //===判斷值和型別（嚴格比較） // 邏輯運算子:&& || ! // 賦值運算子: + =+ -= // 邏輯控制語句 // 條件結構： if-else switch // 迴圈結構：for while do-while // 遍歷： for(var i=0;i<變數名.length;i++){} ; for(var i in 變數名) // 中斷迴圈：break continue </script> </html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
<script type="text/javascript">
// 常用輸出和輸入
document.write("頁面輸出");
alert("警告提示！");
console.log("控制檯輸出");
var pwd= prompt("請輸入密碼","");
document.write(pwd);
</script>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>常用系統函式</title>
</head>
<body>
</body>
<script type="text/javascript">
// 系統函式： parseInt() parseFloat() isNAN(number）（判斷是否是數值）
var num1=parseInt("78.89"); //78
var num2=parseInt("4564cor"); //4564
var num3=parseInt("this36"); //NAN
var flag=isNaN(num3); //true 判斷如果不是數字返回true
var num4=parseFloat("4564cor"); //4567
var num5=parseFloat("45.58"); //45.58
var num6=parseFloat("45.58.25"); //45.58
var num7=parseFloat("cor4568"); //NAN
// 常用事件
// onclick:單機時觸發
// onmouseover: 滑鼠懸浮時觸發
// onkeydown：某個鍵盤按鍵被觸發
// onchange： 域的內容被改變時觸發
// onload:頁面載入時觸發
// 自定義函式
// function 函式名 (引數1，引數2，.....){
// js語句；
// return 返回值;
// }
function study(n) {
for(var i=1;i<=n;i++){
document.write("歡迎學習javaScript"+"<br\>");
}
}
</script>
<!--input 不能寫在JS裡-->
<input type="button" value="顯示5次學習js" onclick="study(prompt('請輸入次數',''))">
</html>
例：統計包含a的個數
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
<script type="text/javascript">
var aa=new Array();
aa[0]="America";
aa[1]="Greece";
aa[2]="Britain";
aa[3]="Canada";
aa[4]="China";
aa[5]="Egypt";
var num=0;
for (var i=0;i<aa.length;i++){
if (aa[i].indexOf("a")!=-1){
num++;
}
}
document.write("共有"+num+"個字串包含a")
</script>
</html>
例：編寫一個四則運算函式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
</body>
<script type="text/javascript">
function calculate() {
var num1= parseFloat( prompt('請輸入第一個數',''));
var num2= parseFloat( prompt('請輸入第一個數',''));
var symbol= prompt('請輸入運算子','');
var num=0;
switch(symbol){
case "+":
num=num1+num2;
break;
case "-":
num=num1-num2;
break;
case "*":
num=num1*num2;
break;
case "/":
num=num1/num2;
break;
}
alert(num1+""+symbol+""+num2+"="+num)
}
</script>
<input type="button" value="計算兩數運算結果" onclick="calculate()">
</html>