1、JavaScript程序設計-JavaScript變量與運算符JavaScript發展歷史 JavaScript 1.0（Brendan Eich，1995.2） JScript1.0（Microsoft 1996.8） JavaScript 1.1-EcmaScript（ECMA-262） EcmaScript1.0 /2.0/3.0/4.0-3.1=5.0(2009)/6.0(2015)3JavaScript語言特點 JavaScript語言的特點： 解釋型的腳本語言，采用小程序端的方式實現編程，不需要事先編譯； 是基于對象的語言，可以運用已經創建好的對象，結合對象的方法和腳本實現所需的功

2、能 是事件驅動的語言，可以直接對用戶的輸入做出響應，不需要服務器的支持，減少了瀏覽器和服務器之間的通信量，提高了響應速度。 變量類型采用弱類型，未使用嚴格的數據類型 是一種安全的語言，只能通過瀏覽器實現信息瀏覽或動態交互，不允許訪問本地硬盤或將數據存到服務器上，不允許對網絡文檔進行修改和刪除，從而有效防止數據的丟失。 是一種與平臺無關的語言，依賴于瀏覽器本身，與操作系統無關，從而實現了一定程度的”一次編寫，隨處運行“。4JavaScript簡介 JavaScript代碼的加入： 使用標簽將javaScript代碼潛入到HTML中。 格式如下：Javascript代碼；/script 標記有兩主

3、要屬性： Language，腳本語言的類型，可以為javaScript或liveScript Src,包含javaScript源代碼的文件，以”.js”為擴展名，可以是javaScript以文件的形式加載到html文件中 JavaScript代碼可以嵌入在HTML的任何位置，但一般推薦將其放在標簽中5網頁中引入JavaScript 案例名稱：第一個案例名稱：第一個JavaScript程序程序程序名稱：程序名稱：2-24.htm document.write(這是以JavaScript輸出的!);一、對一些問題的說明：1、區分大小寫：JavaScript中的變量、函數名和操作符都區分大小寫，關鍵

4、字不能做變量或函數名字。所以，test和Test是兩個變量，typeof因是關鍵字所以不能是函數名或者變量名。2、標識符：就是變量、函數、屬性、函數的參數等。規定：（1）第一個字符必須是字母、下劃線(_)、美元符號（$）。（2）其他字符可以是字母、下劃線、美元符號或數字。數據類型、變量和運算符變量 JavaScript變量的命名： （1）變量命名必須以一個英文字母或是下劃線為開頭，也就是變量名第一個字符必須是A到Z或是a到z之間的字母或是“_”。 （2）變量名長度在0255字符之間。 （3）除了首字符，其他字符可以使用任何合法字符、數字及下劃線，但是不可以使用空格。 （4）不可以使用JavaS

5、cript的運算符號，例如：+，等。 （5）不可以使用JavaScript用到的保留字，例如：sqrt（開方），parseInt（轉換成整型）等。 （6）在JavaScript中，變量名大小寫是有所區別的，例如：變量s12和S12是不同的兩個變量。 JavaScript變量的作用域： 全局變量， 定義在函數體之外，作用范圍是所有函數。 局部變量，定義在函數體內，作用范圍是本函數。保留字abstractdoifpackagethrowsbooleandoubleimplementsprotectedtransientbreakelseimportpublictruebyteextendsinre

6、turntrycasefalseinstanceofshortvarcatchfinalintstaticvoidcharfinallyinterfacesuperwhileclassfloatlongswitchwithconstfornative synchronized continuefunctionnewthis defaultgotonull throw 9JavaScript中的注釋3.JS中的注釋 JavaScript中的注釋和Java基本一致，也分為單行和多行注釋。 注釋信息僅僅做為說明來使用，在程序的解釋和運行中是被忽略的。 單行注釋：使用/符號對單行信息進行注釋 多行注釋

7、：使用/*.*/對多行信息進行注釋 例子：/下面的alert()是彈出一個對話框/*下面的alert()是彈出一個對話框*/alert(這是第一個JavaScript例子!);4、語句：JavaScript中語句以一個;結尾（英文分號）。但可以省略 ; 。比如：注：分號雖不是必須的，但建議必須加上它，這樣可以提高效率（解析器不必再花時間推測應該在哪里插入分號了）和避免錯誤。5、在控制語句中，單行語句可以不加（不放在代碼塊中），但強烈加上即使代碼塊中只有一條語句。多行語句如果放在一個代碼塊中執行，必須加Javascript數據類型大類大類數據類型數據類型說明說明基基本本數數據據類類型型數值類型（

8、數值類型（Number）包含整數和浮點數布爾類型（布爾類型（Boolean）只有true和false兩個值 【兩個值小寫】字符串類型（字符串類型（String）表示一個字符序列，必須使用單引號（）或雙引號（）括起來Undefined類型類型（Undefined）用來確定一個已經創建但還沒有賦初值的變量，只有一個值為：undefined 【小寫】Null類型類型（Null）表名某個變量的值為空，只有一個值為：null【小寫】Symbol(ES6)ES6引入了一種新的原始數據類型Symbol，表示獨一無二的值。 var sbl1=Symbol(user);var sbl2=Symbol(user)

9、;sbl1=sbl2 /false復復合合數數據據類類型型Object類型（類型（Object）該類型的值為對象，對象由一些列屬性（變量）和方法（函數）的集合，訪問它們時用：. (英文點號)數組（數組（Array)一系列的變量組成 函數（函數（Function）包含一段可執行的代碼13 JavaScript腳本語言同其他語言一樣，有自己的基本數據類型、表達式和算術運算符以及程序的基本框架結構。 JavaScript(ES5)的基本類型： 字符串：abc hello 你好“ 特殊字符：又叫轉義字符 b 表示退格 n 表示換頁 t 表示Tab符號 r 表示回車符 表示雙引號本身 表示單引號本身 表

10、示反斜線 數字：包括整數數字和浮點型數字 布爾值：true 和false 空值：null 未定義：undefined Symbol(ES6) var sbl= Symbol(“foo”)類型轉換為了適應不同的情況，JavaScript提供了兩種數據類型轉換的方法：一種是將整個值從一種類型轉換為另一種數據類型（稱作基本數據類型轉換）；另一種方法是從一個值中提取另一種類型的值，并完成類型轉換。JavaScript提供了三個方法實現基本數據類型之間的轉換： String()：將其他類型的值轉換為字符串。例如，String(123)將數值123轉換為字符串“123”。 Number()：將其他類型的值

11、轉換為數值型數據。例如，Number(false)可以將布爾型直接量false轉換為數值0。 Boolean()：將其他類型的值轉換為布爾型值。除0、NaN、null、undefined、“”（空字符串）被轉換為false外，所有其他值都被轉換為true。JavaScript中還提供了三種通過提取數據進行數據類型轉換的方法：parseInt()、parseFloat()和eval()。15變量 JavaScript變量的定義：Javascript中采用弱類型變量，變量可以不做聲明或不做類型聲明，而在使用是確定類型。例如：x=100、y“abc”等等但是，聲明變量的好處是能夠及時發現程序中的錯誤

12、。javaScript中變量的定義使用關鍵字var/let關鍵字來實現。區別：var不支持塊級作用域let支持塊級作用域例如：var id;聲明變量必須明確變量的命名、類型及作用域。變量聲明 格式1：var 變量名1,變量名2,變量名3,下面是使用格式1聲明變量的示例代碼：var i;var a,b,c;var name,password;在聲明變量的同時，可以為變量指定一個值，這個過程稱為變量的初始化。但該過程不是強制性，可以聲明一個變量，但不初始化這個變量，此時，該變量的數據類型為undefined。 格式2：var 變量名1=值1,變量名2=值2 變量名3=值3,下面是使用格式2聲明變量

13、的示例代碼：var name=張三;var i=0,j=1;var flag=true; 判斷變量類型 注：A、typeof操作符的操作數可以是變量也可以是數值字面量。如： B、因typeof是一個操作符而不是函數，所以可以使用小括號（()）將操作數括起來，也可以不使用，如： C、typeof(null) 返回值是object，原因在于特殊值null被認為是一個空對象的引用（一個對象為空時，值是null）。上頁中有例子。 2、undefined類型： 該類型只有一個值，即特殊的undefined。在使用var聲明變量但未對其加以初始化時，這個變量值就是undefined。(注意值為小寫，JS大

14、小寫敏感)。示例： 知識擴充：包含undefined值的變量和尚未定義的變量是不一樣的。例如： 對于尚未聲明的變量，可以使用typeof操作符檢測其數據類型。返回值也為：undefined值，和定義后未賦初值的變量一樣。即使用一個未定義的變量時沒有值，但其類型為Undefined。建議：定義一個變量時顯式地初始化變量。 3、Null類型：只有一個值，即：null。null值表示一個空對象（這正是使用typeof檢測null值會返回“object”）。如：知識擴充：如果定義的變量準備將來用于保存對象，那么最好將該變量初始化為null而不是其他值。這樣，直接檢查null值就可以判斷相應的變量是否已

15、經保存了一個對象的引用：var car=null;/其他操作if(car!=null) /前提是car已賦初值null/對car進行某些操作另： 4、Boolean類型：該類型有兩個值：true和false。（必須全是小寫）可以將其他值通過Boolean()函數轉換為Boolean類型，返回值取決于要轉換值的數據類型和實際值。其他類型轉為Boolean類型的規則：數據類型數據類型轉換為轉換為true值值轉換為轉換為false值值BooleantruefalseString任何非空字符串（空字符串）Number任何非零數字值（包括無窮大）0和NaNObject任何對象nullUndefinedu

16、ndefined 知識擴充：使用流控制語句（比如if語句）時，會將其他值自動轉換為相應的Boolean轉換（根據相應的數據類型和對應的值）。比如： 運行結果： 5、Number類型：包括整數和浮點數值（雙精度數值）。除了常用的十進制外，還可以表示八進制和十六進制。八進制的第一位必須是0，后跟（07），十六進制前兩位是0 x，后跟（09及AF）。八進制和十六進制表示的數值最終將被轉換為十進制。（1）浮點數值：該數值中必須包含一個小數點。var num1=1.1;var num2=0.1;var num3=.1;/有效，但不推薦。如果數值只有小數部分，則可以省略整數部分的0。 （2）數值轉換： 2

17、個函數將非數值轉換為數值：parseInt()：用于將字符串轉換成整數數值。parseFloat()：用于將字符串轉換成浮點型數值。parseInt():將字符串轉換為整數。規則：A、它會忽略字符串前面的空格，直至找到第一個非空格字符，如果第一個字符不是數字字符或者負號，則返回NaN。B、轉換空字符串返回NaN。 C、如果第一個字符是數字字符，會接著進行解析，直到完成或者遇到非數字字符。D、使用該函數的第二個參數指定轉換時要轉成的進制數。指定基數會影響到轉換的輸出結果：注意：如果需要將表單中的數值（字符串）在前臺通過JS進行算數運算時，必須先使用parseInt或者parseFloat進行轉換

18、再運算。 知識擴充：（1）保存浮點數值需要的內存空間是保存整數的兩倍，因此js會自動將一些能夠轉換為整數的自動轉換為浮點數，如小數點后沒跟任何數字（如1.）或者浮點數本身是個整數（如1.0）。如： 結果都為1： （2）可以使用e表示法（科學計數法），值為e前面的*10的指數次冪。var num=3.125e7; /等價于 31250000var num=3e-7;/0.0000003； （3）由于精度問題，導致進行浮點數的算數運算時有時結果不準確。如： 第一個alert輸出： 第二個輸出：（4）數值范圍：ECMAScript表示的最小數值是：Number.MIN_VALUE(一般瀏覽器該值是：

19、5e-324)能夠表示的最大值是：Number.MAX_VALUE.上面兩個值，不同瀏覽器會有區別，使用下面的語句可測出： （5）NaN：（Not a Number）。表示一個本來要返回數值的操作未返回數值的情況，比如：任何涉及NaN的操作（如NaN/10)都會返回NaN 。NaN與任何值都不想等。包括NaN本身。alert(Nan=Nan);/falseisNaN()，用來判斷數值是否“不是數值”，不是數值時返回true，否則，返回false。（2）length:該屬性返回字符串的長度。關于漢字等雙字節字符，length屬性可能不會精確地返回字符串中的字符數目。（實際上，js中雙字節字符算一

20、個長度，是由unicode編碼決定的（該編碼用2個字節表示） alert(“軟件工程系.length);/5 （4）【了解】將其他數值轉換為字符串： A：.toString():函數 可以將其他數值（包括字符串，除了null和undefined值）轉換為字符串表現。 var age=11; var ageAsString = age.toString();/”11” var bool=true; var boolAsString = bool.toString();/”true” 特別注意null和undefined無法轉成字符串。可以為該函數指定一個參數（值為2、8、10、16）分別用以轉換

21、數值時變成不同進制的字符串數據。var num=10;num.toString(2);/1010 ，轉成二進制num.toString(8);/12，轉成八進制num.toString(10);/10 ，轉成十進制num.toString(16);/A 或a ，轉成十六進制 B：String(要轉換的數值):該函數和.toString()的區別在于可以轉換null和undefined值。var value1=null,value2;String(value1);/nullString(value2);/undefined運算符根據運算類別，可以將JavaScript中的運算符分為以下6類： 算

22、術運算符 按位運算符 賦值運算符 關系運算符 邏輯運算符 其他運算符根據操作數的個數，可以將JavaScript中的運算符分為3類： 單目運算符：只作用于一個數據的運算符 雙目運算符：作用于兩個數據上的運算符 三目運算符：作用于三個數據上的運算符JavaScript的運算符 數學運算符： 加法運算符”+” 減法運算符“-” 乘法運算符”*” 除法運算符“/” 取模運算符“%” 遞增運算符“+” 遞減運算符”-”算術運算符算術運算符 加法運算符 加法運算符使用數學符號“+”，屬于雙目運算運算符，返回兩個操作數的算術和。操作數的類型要求為數值型，如果是字符串型則意義不同，主要運用在數值求和的場合，

23、其語法如下代碼所示。示例如下所示。01/ 腳本程序開始0208算術運算符算術運算符 減法運算符 減法運算符使用數學符號“”，屬于雙目運算符，返回兩個操作數的算術差，操作數類型要求為數值型。含義與數學上的減法計算完全一樣，使用的形式如下代碼所示。01/ 腳本程序開始0208算術運算符算術運算符 乘法運算符 乘法運算符使用符號“*”，屬于雙目運算符，返回兩個操作數的算術積。運算意義上完全等同于數學上的乘法計算，使用語法如下所示 。0102var employee = 300;/ 雇員總數03var prize = 370;/ 每人獎金數額04var total = employee * prize

24、;/ 預算總額05alert( 預算： + total + 元 );/ 輸出總額06 算術運算符算術運算符 除法運算符 除法運算符使用符號“/”，也是屬于雙目運算符，操作數類型要求為數值型。其返回兩個操作數之商，JavaScript返回的商是實數集內的數據，也就是浮點型數據。意義上等同于數學中的除法運算，因此可用在求商的場合，使用語法如下。01/ 腳本程序開始0207算術運算符算術運算符 模運算符 取模運算符使用符號“%”，其作用是求一個數除以另一個數的余數。操作數的類型要求為數值型或能轉換為數值型的類型，屬于雙目運算符。事實上“模”可以這樣理解，如手表上的小時刻度，每到12點以后就是1點，此

25、鐘表的模為12。通常取模運算可以取求某個數的倍數 。0102for( i = 1; i1000; i+ ) / 找出0到1000中3的公倍數0304 if( i%3 = 0 ) / 當模3為0時即是3位數05 06 document.write( i + ); / 輸出07 0809算術運算符算術運算符 負號運算符 負號運行符使用符號“-”，取負也就是等于取反。等同于數學意義的上負號，屬于單目運算符，語法如下。這里就負號運算符來看一個例子。010207算術運算符算術運算符 正號運算符 正號運算符使用符號“+”，針對數值類型操作數，意義上等同于數學上的正號。屬于單目運算符，語法如下。 遞增運算符

26、代碼的裝入遞增運算符使用符號“+”，也稱為自增運算符，屬于單目運算符。可使數值類型的變量值自增一，操作數只能是變量。使用形式分左結合與右結合兩種，左結合在表達式中的效果是先遞增再使用，右結果則是先使用再遞增。語法如下：算術運算符算術運算符 遞減運算符 遞減運算符使用符號“-”，也稱為自減運算符，可使變量的值自減一。效果與遞增運算符完全相反，也有左結合與右結合之分，情況與遞增運算符相同，此不贅述，下面來看一個例子。0102!-03 var a = 5;/ 定義一個數字變量04 document.write( a ); / 輸出a原來的值05 document.write( );/ 輸出換行標簽0

27、6 a- ; / a自減一（右結合）07 document.write( a );/ 輸出變量a08 document.write( );/ 輸出換行09 -a; / a自減一（左結合）10 document.write( a );/ 輸出變量a11 document.write( );/ 輸出換行12 if( -a = 2 )/ 測試左、右結合位于表達式中的情況13 14 document.write( 左結合的情形 );/ 輸出提示信息15 16 if( a- = 2 )/ 等于2時17 18 document.write( 右結合的情形 );/ 輸出提示信息19 20-21位運算符位運算

28、符位運算符：位運算符：按位與按位與”&”按位或按位或”|”按位異或按位異或”按位取非按位取非”左移操作符左移操作符”邏輯右移操作符邏輯右移操作符” var result = 25 & 3; console.log(result); /outputs 1var result = 25 | 3; console.log(result); /27var num1 = 25; /binary 00000000000000000000000000011001 var num2 = num1; /binary 11111111111111111111111111100110 console

29、.log(num2); /-26 var result = 25 3; console.log(result); /26 邏輯運算符 邏輯運算符 邏輯與&” 邏輯或”|” 邏輯非“！”邏輯運算符 邏輯與、運算符 邏輯與運算符用“&”表示，邏輯或運算符用“|”表示，它們屬于雙目運算符，操作數被當成布爾類型，可以是變量也可以是常量。 邏輯與運算符使用語法如下所示。 “|”運算符語法如下： 邏輯非運算符“!”，屬于單目運算符，對操作數的邏輯值取反，操作數可以是變量或常量。關系運算符 關系運算符 等于“=” 不等于”!=” 小于” 小于等于”=” 嚴格等于”=” 嚴格不等于”!=” i

30、n 運算符關系運算符 相等運算符相等運算符使用符號“=”，判斷兩個操作數是否相等。如果相等返回布爾值true，否則返回false。屬于雙目運算符，兩個操作數的數據類型可以任意。運行時，“=”操作符將兩端的操作數轉換為同一種數據類型后再作比較。使用語法如下： 等同運算符 前述及的相等運算符“=”進行的是非嚴格意義上的相等性判斷，即通過類型轉為后相等的也返回true。而等同運算符“=”是嚴格意義上的相等，兩個值和它們的類型完全一致時才返回true，使用語法如下：關系運算符 不等運算符 不相等運算符使用符號“!=”，屬于雙目運算符，返回一個布爾值表示兩個操作數是否相等。兩個操作數類型任意，同時可以是

31、變量也可以是常量。使用語法如下： 不等同運算符 不等同運算符，使用符號“!=”，屬于雙目運算符。效果與等同運算符正好相反，如果兩個數嚴格不相等則返回true，使用語法如下。關系運算符 小/大于運算符 小于運算符是判斷第一個操作數是否小于第二個操作數的運算符，返回一個布爾值。使用符號“”表示，常用于邏輯表達式中。使用語法如下：大于運算符與小于運算符相似，效果相反。 instanceof運算符 instanceof運算符返回一個布爾值，表明某對象是否是某個類的實例。得到一個對象時，有時需要得知其屬于哪個類，確定對象的身份。使用語法如下：關系運算符 小/大于或等于運算符 小于或等于符運算符判斷第一個操作數和第二個操作數間是否是小于等于關系，使用符