一、JavaScript介紹
Javascript語言誕生主要是完成頁面的數據驗證。因此它運行在客戶端，需要運行瀏覽器來解析執行JavaScript代碼。
特點：
- 交互性（它可以做的就是信息的動態交互）
- 安全性（不允許直接訪問本地硬盤）
- 跨平台性（只要是可以解釋Js的瀏覽器都可以執行，和平台無關
JavaScript與Java不同
- JS是Netscape公司的產品，前身是LiveScript;Java是Sun公司的產品，現在是Oracle公司的產品。JScript微軟 w3c ECMA組織 ECMAScrip jQuery
- JS是基於對象，Java是面向對象。
- JS只需解釋就可以執行，Java需要先編譯成字節碼文件，再執行。 JS代碼有無，瀏覽器一般不會提示錯誤。
- JS是弱類型，Java是強類型。
二、JavaScript和html代碼的結合方式
1. 第一種方式 使用script標簽嵌入js代碼
需要在html文件中嵌入JavaScript代碼時，需要在html文件中使用script標簽完成。
2.第二種方式 外部引入js文件
3. JS中的注釋
JavaScript是一門編程語言：
任何一門語言都具備如下的特點：
1、注釋
2、關鍵字、標識符
3、常量、變量、運算符
4、語句、判斷、循環、switch
5、函數 方法
6、數組
我們學習JS和Java的不同之處。
java中的注釋：// 、/** */、 /* */
js中的注釋有2種：
單行注釋：
// 注釋內容
多行注釋：
/* 注釋內容 */ 多行中不能嵌套多行注釋，但可以嵌套單行注釋
4.、關鍵字、標識符
關鍵字：被JS賦予了特定含義的單詞或者字母的組合。
var if switch do while for continue break 等
標識符：開發者根據自己的需求定義的一個符號，這些符號可以由 字母 數字 下划線 $ 符號，開始不能是數字。
5、常量
Java中的常量：
整數、小數、字符、布爾值、null、字符串。
Java中的數據類型：
整數：byte short int long
小數：float double
字符：char
布爾：boolean
字符串：String
Js中的常量：
數值：整數和小數
字符串：在js中使用單引號或者雙引號引用起來的全部都是字符串
布爾：true false 在js中零，null、undefined等可以理解成false，所有非零、非null、非undefined值都可以理解成true。
null：null
undefined：undefined
JS中的數據類型：
數值型：number
字符串：string
布爾：boolean
對象類型：Object
在JS中也有二進制、八進制、十進制、十六進制。運算規則和Java一致。
6、變量
變量：表示的是一個內存空間。可以保存常量數據。
Java中如何定義一個變量：
數據類型 變量名 ; 數據類型 變量名 = 初始值;
JS中定義變量：
var 變量名； var 變量名 = 初始值;
JS中定義的變量空間，在沒有賦值之前，這些空間中是沒有數據類型的。定義的空間可以保存任何類型的數據。
1 // 1. 定義一個變量名，使用typeof檢測類型 2 // 2. 給變量賦值數值型，使用typeof檢測類型 3 // 3. 給變量賦值字符串型，使用typeof檢測類型
7. 運算符：
+ - * / % ++ --
1、由於js中的小數和整數都是number類型，不存在類似整數除以整數還是整數的結論。
2、字符串和其他的數據使用+號運算，會連接成一個更長的字符串。
3、如果字符串和和非+號的進行運算，
如果字符串可以轉成number數據，就會把字符串轉成number數據進行運算。
如果字符串無法轉成numbe 進行運算，就得到NaN結果，表示當前是一個非數字結果。
NaN ： not a number
示例：
// 猜結果
var x = 4321 / 1000 * 1000;
alert(x); // 4321
var y = "23" + 20;
alert(y); // 2320
var z = "23" - 20;
alert(z); // 3
var j = "aaa" - 20;
alert(j); // NaN
a.、賦值運算
= 把右側結果賦值給左側空間。
var x = 123；
+= -= *= /= %= 和Java運算一致
b. 關系（比較）運算
三、函數
1. 第一種
格式：
function 函數名( 參數列表 )
{
函數體;
}
函數的細節：
2.第二種定義函數的格式
格式：
var 函數名 = new Function( “接受數據的變量名”,”函數體的代碼” );
3. 第三種定義函數的格式
第三種定義方式：匿名函數
格式：
function(){
函數體;
}
1 <script type="text/javascript"> 2 var demo = function(){ 3 alert("123"); 4 } 5 //demo(); 6 7 // window對象是js已經創建好的，我們可以直接使用的對象 8 // onload是js對象的一個加載事件，這個功能：當整個頁面加載完成后執行 9 window.onload = function(){ 10 // alert("咱們帥哥真多！"); 11 12 // 給用戶名的input綁定單擊事件 13 document.getElementById("username").onclick = function(){ 14 // 將input框中的值清空 15 document.getElementById("username").value = ""; 16 } 17 } 18 </script> 19 </head> 20 21 <body> 22 用戶名：<input type="text" id="username" value="美女姓名"/> 23 </body>
window.onload = function(){
alert("咱們帥哥真多！"
);
其實就是當頁面加載完成后執行 就是說頁面全部加載完畢 最后才執行 ， 那上面用戶名美女姓名當你頁面加載完畢后 會在text文本標簽中顯示美女姓名，所以在綁定單擊事件后清空
四、JS中的對象
1、Date對象
1 <script type="text/javascript"> 2 3 // 定義日期 4 var d = new Date(); 5 document.write(d.toLocaleString() + "<br/>"); 6 document.write(d.toLocaleTimeString() + "<br/>"); 7 document.write(d.toLocaleDateString() + "<br/>"); 8 9 // 頁面加載完成后執行 10 window.onload = function(){ 11 window.setInterval("setTime()",1000); 12 } 13 14 function setTime() { 15 // 創建日期對象 16 var d = new Date(); 17 // 獲取div標簽對象，向里面放值 18 document.getElementById("setTime").innerHTML = d.toLocaleTimeString(); 19 } 20 </script> 21 </head> 22 23 <body> 24 <div id="setTime"></div> 25 </body>
String對象
Math對象和Java中的基本一致
RegExp對象，正則對象，正則表達式的書寫規則和Java也一致：
. 當前可以是任意字符
? 表示零次或一次
* 表示零次或多次
+ 表示一次或多次
() 對某個存在的正則進行分組 組的使用 \組號 $組號
{} 當前的規則可以出現的次數
{m} 正好 m次 {m,} 最少m次 {m,n} 最少m次 最多n
[] 當前位置上可以是中括號中某個字符
[abc] [^abc]
\\d 當前位置上可以數字
\\w 當前位置上可以是字母 數字 下划線
\b 單詞邊界
^ 行開始
$ 行結尾
1 需求： 2 1、需要打印當前當前的時間；yyyy-MM-dd hh:mm:ss 3 2、給定字符串，判斷是否符合4~12位的字母 數字 下划線的的組合。
一定要寫 行開始和行結束
2. JS中的全局函數
在JS中有上述的函數，可以直接在js代碼中使用，不需要通過任何對象來調用。
需求：
1、 對含有中文參數的URL進行編碼和解碼
2、 使用eval將字符串轉成js代碼執行（重要,JASON都會用到）
1 <script type="text/javascript"> 2 //1、 對含有中文參數的URL進行編碼和解碼 3 var url = "http://www.baidu.com?username=高圓圓&age=23&sex=女"; 4 // 編碼 5 var encUrl = encodeURI(url); 6 //alert(encUrl); 7 // 解碼 8 var decUrl = decodeURI(encUrl); 9 //alert(decUrl); 10 11 //2、 使用eval將字符串轉成js代碼執行 12 eval("alert('abc')"); 13 </script>
1、js和Java的不同之處。
2、函數的定義和使用 第一種 和第三種
3、了解 js中的數組操作
五、JS中的自定義對象：
1、js中的函數就是對象，對象就是函數。
2、動態的給對象添加屬性和方法。
3、給對象定義默認的構造方法。
1 /* 2 1、js中的函數就是對象，對象就是函數。 3 4 2、動態的給對象添加屬性和方法。 5 6 3、給對象定義默認的構造方法。 7 */ 8 function Person() {} // 理解為定義一個類 9 10 var person = new Person(); // 實例化一個Person 11 12 // 2、動態的給對象添加屬性和方法。 13 person.name = "高圓圓"; 14 person.age = "23"; 15 16 person.setName = function(name){ 17 this.name = name; 18 } 19 20 person.getName = function() { 21 return this.name; 22 } 23 24 alert(person.name + " " + person.age); 25 26 person.setName("楊冪"); 27 alert(person.getName()); 28 29 var person2 = new Person(); 30 // person2.setName("baby"); 31 32 // 3、給對象定義默認的構造方法。 33 function Dog(name, color) { 34 this.name = name; 35 this.color = color; 36 37 this.setName = function(name) { 38 this.name = name; 39 } 40 41 this.getName = function(){ 42 return this.name; 43 } 44 } 45 46 var d = new Dog("旺財","黑色"); 47 alert(d.getName());