JavaScript 概述
JavaScript是基於物件和事件驅動的腳本語言,主要應用在客戶端。
特點:
1. 互動性(它可以做的就是資訊的動態互動)
2. 安全性(不允許直接存取本地硬碟)
3. 跨平台性(只要是可以解釋Js的瀏覽器都可以執行,和平台無關)
JavaScript與Java不同
1. JS是Netscape公司的產品,前身是LiveScript;Java是Sun公司的產品,現在是Oracle公司的產品。
2. JS是基於對象,Java是物件導向。
3. JS只要解釋就可以執行,Java需要先編譯成字節碼文件,再執行。
4. JS是弱型,Java是強型別。
JavaScript語法
每一種語言都有自己的語法規則,JS語法與Java很像,所以學習起來比較容易。 JS中也一樣有變量,語句,函數,數組等常見語言組成元素。
1. 變數
透過關鍵字var來定義,弱型別既是不用指定特定的資料型別。
例:var x = 3; x = “hello”;
註:JS中特殊的常數值:undefined,當變數沒有初始化就被使用,該變數的值就是undefined(未定義)。
注意:Javascript的語句在結尾處是可以不用分號結束的,非嚴謹語言的特徵。
但為了符合程式規範,需要像java一樣定義結束符。
而且有些情況是必須寫分號的,如:var x = 3 ; var y =5如果兩條語句寫在同一行,就需要分號隔開。
1)關鍵字:幾乎跟Java一樣
2)標識符,分隔符號:和Java一樣
3)註解:用了Java當中的這兩種: // 和/* */
4)資料型態:number型別、string型別、boolean型別、undefined(當變數宣告但沒有賦值)
5)變數:var (弱型別,類似Java當中的Object)
6)在js當中,單引號與雙引號是一樣的,封裝的都是字串(但同時有兩個引號封裝的,內部的要用單引號)
7)全域變數和局部變數
全域變數----只要不是函數內部聲明的,都是。並且不會以大括號來區分,也不會以<script>來區分<br/><br/>a、只要不在函數內部聲明,那麼一個變數即使在導入的.js檔案中聲明,在頁面腳本中同樣是有效的。 <br/><br/>b、Java當中的變數的作用域是以大括號來區分,而JS則不是。 <br/><br/>局部變數----函數內部宣告的和形參<br/><br/>函數內部的形參也是局部的,裡面改變的值只能在內部有效,函數回傳之後就無效了<br/><br/>例:</script>
<html> <head> <title>javascript语言学习</title> </head> <body> <script type="text/javascript"> //1 标识符,关键字,分隔符---几乎和Java一样 //2 注释:只支持 //单行 和 /*多行*/ //3 变量:弱类型 , 所有的变量都是用var来声明---本质上就是Java当中的Object类型 var x=3; var y="abc"; //alert(x+","+y); x="xyz"; //alert(x); x=true;//js当中的布尔类型和C一样,有0 和 非0 的概念 x+=1; //alert(x); a=3.14;//因为浏览器有兼容性,所以一个变量不声明类型也可以直接对期赋值(但不要去读),因为是弱类型,都是var,写不写一样 //alert(a); //alert(aa);//由于变量aa没有声明也没有赋值,所以这里是出错的,没有输出 a='aa'; //alert(a);//js当中,单引号和双引号是一样的,对应的变量都是字符串---js当中没有字符类型--包含在字符串当中 //a=33223232323232332322323232323456; //alert(a); //alert(typeof(a));//number //由于浏览器有兼容性,一条语句的末尾不加分号,也可以正常执行,但这样写不规范,建议还是加上。 //另外,同一行当中的多条语句之间的分号不能省,否则不能正常执行 var m=1; var n=2; //alert(m+n); </script> <script type="text/javascript"> //4 基本数据类型 //alert( typeof("aaaa") );//string //alert( typeof('0') );//string //alert( typeof(false) );//boolean //alert( typeof(100) );//number //alert( typeof(1.23) );//number //alert( typeof('0')=="string" );//true //alert (typeof(x)=='number');//true --使用单引号和双引号,效果是一样的 //alert( typeof('0')=="String" );//false----※※※大小写敏感※※※ //alert( typeof(x) ); //前面片段中定义的变量,在这里仍然是有效的 //alert( typeof(X) ); //undefined--代表该变量没有定义--因为前面只定义了小写的x </script> </body> </html>
2 . 運算子
Javascript中的運算子和Java大致相同。
只是運算過程中需要注意幾點:
1, var x = 3120/1000*1000; x = 3120;而不是3000。
2, var x = 2.4+3.6 ; x = 6;而不是6.0
3, var x = “12” + 1; x = “121”; x = “12” – 1 ; x = 11;
加號對於字串是連接符
4, && || 是邏輯運算子& |是位元運算子。
5, 也支援三元運算子
6, 特殊運算子 typeof : 傳回一個操作表達式的資料類型的字串。
var x = 3;
var y = “123”;
var z = false;
typeof(x); //number
typeof(y); //string
type; //boolean
例:
<html> <head> <title>javascript语言学习</title> </head> <body> <script type="text/javascript"> //5 运算符:算术、赋值、比较、位运算、三元运算 //5.1算术运算 var a=3710; //alert("a="+a/1000); //alert("a="+a/1000*1000); var b=2.3; var c=5.7; //alert(b+c);//8 //alert(11+23);//34 //alert("23"+11);//2311---string---加号为字符串连接 //alert("23"-11);//12 ---字符串遇到减号,自动会转换成数值型进行运算 //alert(true);//true 和数值进行运算时,true为1,flase为0 //alert(true+1);//2 //alert(false+1);//1 //alert(100%3);//1 //alert(100%-3);//1 //alert(-100%3);//-1 如果有负数,结果和前面那个数同符号。---和Java是一样的 //5.2 赋值运算: = += -= *= /= %= var n=3,m; m=n++;//用法同Java //alert("m="+m+",n="+n);//m=3,n=4 var n=3,m;//和Java不同的是,变量可以重复声明 m = ++n;//用法同Java //alert("m="+m+",n="+n);//m=4,n=4 var n; //alert(n);//4---这里没有对该变量重新赋值,所以用的还是前面的那个,不重新开内存 var i=3; i +=3;//其它的如:-= *= /= %= ,同理 //alert("i="+i); //5.3 比较运算符 var j=10; //alert( j>5 ); //其它如 :< >= <= == != 等,同理 //alert( j==10 ); //alert( j!=10 ); //5.4 逻辑运算符 && || ! var k=4; //alert(k>3 && k<10); //true //alert( !(k>3) ); //false //alert( !k );//k是“非0”,再非一下则是flase---0 //5.5 位运算符 & | ^ >> << >>>(无符号右移) ---和Java一样 var c = 6; //6: 110 //3: 011 //alert( c&3 );// 010 --2 //alert(c^100^100); //c---6---一个数与两个相同的数进行异或运算结果仍然等于原数 //alert(c>>>1);//3 //5.6 三元运算符---?号表达式 ----和java一样 //alert(3>0?100:300); var xxyy; //alert(xxyy); //undefined---如果一个变量声明之后没有赋值,那么就是该值 alert(xxyy==undefined);//true ----这个undefined代表的是和true,false等一样的,是一个值,因此不要用引号 alert(xxyy=="undefined");//false </script> </body> </html>
1. 判斷結構(if語句)
註:var x = 3;
if(x==4)//可以進行比較運算。
if(x=4)//可以進行賦值運算,而且可以同樣進行判斷。不報錯。
因為在Js中0或null就是false,
非0或非null就是true(通常用1表示)。
所以if(x=4)結果是true;
可以透過if(4==y)來解決問題。因為4=y不會進行判斷,而是會報錯。
2. 選擇結構(switch語句)
與java不同的是:因為弱類型,也可以對字串進行選擇。
3. 迴圈結構(while語句,do…while語句,for語句)。
註:不同的是,沒有了具體資料類型的限制,使用時要注意。
例:
<html> <head> <title>javascript语言学习</title> </head> <body> <script type="text/javascript"> /* //if语句 var x=3; if (x>0){ alert("yes"); } else { alert("no"); } if (x-4) {//非0 即是 true,除了0以外的数都是非零的数,即为true alert("yes2"); } else { alert("no2"); } if (x=4) {//一个“=”号是赋值,赋的值是4,该值同时也作为整个表达式的值---非0, 即是 true alert("yes3"); } else { alert("no3");//如果把上面的4改为0,则输出: no3 } //根据上面的结果,建议如果是判断某变量是否等于某值,写成如下方式(把数字放在前面) if (4==x) {//这种方式能够避免漏写“=”号的bug alert("yes4"); } else { alert("no4"); } var b=(3,4+5);//逗号表达式中的最后一个式子的值作为整个的结果 alert(b); var c=5; if(c>1){ alert("a"); }else if(c>2){ alert("b"); }else if(c>3){ alert("c"); }else{ alert("d"); } //结果:a */ </script> <script type="text/javascript"> //Java语言:switch表达式支持的类型:byte,int等整数,char,jdk1.7之后增加了String类型 //JavaScript语言:支持所有类型,即所有类型的数据都能用于选择 var x="x"; switch(x){ default:alert("c"); case "aa":alert("a");break; case "abc":alert("b"); }//常规的写法就不说了,说说这种的,这种的显示结果是c和a,因为在default处进入之后并没有break所以会进入到case "aa"里面去 </script> </body> </html>
<html> <head> <title>javascript语言学习</title> <link rel="stylesheet" href=table.css> </head> <body> <script type="text/javascript"> a:for (var x=0;x<3;x++){ for (var y=0;y<4;y++){ document.write("x="+x+" "); break a; } document.write("<br/>"); } </script> <hr/> <h2>九九乘法表</h2> <script type="text/javascript"> for (var x=1;x<=9;x++){ for (var y=1;y<=x;y++){ document.write(y+"*"+x+"="+x*y+" "); } document.write("<br/>"); } </script> <br/> <h2>九九乘法表</h2> <script type="text/javascript"> document.write("<table>"); for (var x=1;x<=9;x++){ document.write("<tr>"); for (var y=1;y<=x;y++){ document.write("<td>"+y+"*"+x+"="+x*y+"</td>"); } document.write("</tr>"); } document.write("</table>"); </script> </body> </html>