JavaScript語言基礎

爲何要有JavaScript

• JavaScript最初的目的

　　判斷客戶端的輸入（之前的網速慢）

• JavaScript如今的意義

　　頁面特效(PC端的網頁效果)
　　移動端(移動web和app)
　　異步和服務器交互
　　服務端開發(nodejs)

• 演示JavaScript的炫酷

　　http://www.codecombat.cn/（遊戲）
　　http://www.webhek.com/

瀏覽器是如何工做的

JavaScript語言

JavaScript是世界上用的最多的腳本語言
腳本語言：不須要編譯，直接運行時邊解析邊執行的語言
JavaScript是一種客戶端的腳本語言

 

JavaScript的歷史

當時工做於 Netscape 的 Brendan Eich，開始着手爲即將在 1995 年發行的 Netscape Navigator 2.0 開發一個稱之爲 LiveScript 的腳本語言，當時的目的是在瀏覽器和服務器（原本要叫它 LiveWire）端使用它。Netscape 與 Sun 及時完成 LiveScript 實現。就在 Netscape Navigator 2.0 即將正式發佈前，Netscape 將其改名爲 JavaScript，目的是爲了利用 Java 這個因特網時髦詞彙。Netscape 的賭注最終獲得回報，JavaScript 今後變成了因特網的必備組件。

三足鼎立
由於 JavaScript 1.0 如此成功，Netscape 在 Netscape Navigator 3.0 中發佈了 1.1 版。恰巧那個時候，微軟決定進軍瀏覽器，發佈了 IE 3.0 並搭載了一個 JavaScript 的克隆版，叫作 JScript（這樣命名是爲了不與 Netscape 潛在的許可糾紛）。微軟步入 Web 瀏覽器領域的這重要一步雖然令其聲名狼藉，但也成爲 JavaScript 語言發展過程當中的重要一步。
在微軟進入後，有 3 種不一樣的 JavaScript 版本同時存在：Netscape Navigator 3.0 中的 JavaScript、IE 中的 JScript 以及 CEnvi 中的 ScriptEase。與 C 和其餘編程語言不一樣的是，JavaScript 並無一個標準來統一其語法或特性，而這 3 中不一樣的版本偏偏突出了這個問題。隨着業界擔憂的增長，這個語言的標準化顯然已經勢在必行。

 JavaScript、HTML、CSS

JavaScript、HTML、CSS各自的做用
HTML 提供網頁上顯示的內容（結構）
CSS 美化網頁（樣式）
JavaScript 控制網頁行爲（行爲）
設計原則：
結構、樣式、行爲---分離！

JavaScript的組成

ECMAScript
JavaScript的語法規範
DOM
JavaScript操做網頁上元素的API
BOM
JavaScript操做瀏覽器部分功能的API

 

引入JavaScript

HTML頁面書寫JavaScript

引入外部JavaScript文件

 

 script標籤的屬性

type
type="text/javascript"
能夠省略
async
async="async"
值能夠省略，當即異步下載外部js，不影響頁面其它的操做，全部js完畢執行
defer
defer="defer」
值能夠省略，腳本延遲到文檔徹底被解析和顯示後再執行，只有外部腳本可使用

JavaScript的變量

變量是在計算機中存儲數據的一個標識符。
變量能夠在聲明的時候賦值，也能夠稍後賦值。
例如：
var number = 50;
var name = "馬戶";
或者
var name;
name = 「張三」;
能夠在一行上定義多個變量
var name,age,sex;

弱類型

JavaScript是弱類型的腳本語言
下面這兩行代碼在JavaScript中是合法的，緣由是JavaScript是弱類型的語言。不推薦使用。
var age = 90;
age = 「馬戶」;

 變量命名規則和規範

規則(必須遵照)
由字母、數字、下劃線、$組成
不能是關鍵字和保留字
區分大小寫
規範(建議遵照)
變量的名稱要有意義
變量的命名遵照駝峯命名法，首字母小寫,第二個單詞的首字母大寫
例如：userName

註釋

單行註釋
//單行註釋
多行註釋
/* 多行註釋 */
註釋的應用
註釋通常用於解釋某些複雜代碼的邏輯，方便與後期的維護和開發
註釋通常用於對整個模塊進行分割劃分，方便於代碼查找代碼和維護
註釋通常用於：模塊、函數、複雜邏輯註解、文件註解、維護記錄等

目標

掌握四種經常使用的數據類型
Number
String
Boolean
Undefined //變量聲明，但未賦值
null

數據類型

計算機在存儲數據的時候是有類型的
JavaScript中的數據類型
簡單(基本、值)數據類型
Number、String、Boolean
Undefined、Null
複雜(引用)數據類型（暫時瞭解）
Object、Array、Date等
查看當前變量的數據類型
typeof name
typeof(name)

☞簡單數據類型

  ◆number   數字類型

  ◆string     字符串類型

        var   s1=」123」;   s1的數據類型字符串

  ◆Boolean   布爾類型

   ◆true      真 （正確的）

   ◆false     假（錯誤的）

   ◆undefined     變量未初始化

　 var   s1; 定義了變量，可是沒有給變量賦值，那麼該值的數據類型就是  undefined 類型

 

  ◆變量取值爲null的時候

    var   s1=null;  表示變量值爲空，該變量在內存中是不存在的。真正的空。   s1的數據類型爲 object

 ☞複雜數據類型

◆object    對象

◆Array     數組

數值字面量

字面量
固定的值，讓你從「字面上」理解其含義。
數值字面量
var age = 18; // 數值字面量，18爲字面值

Number類型
十進制
var num = 9;
進行算數計算時，八進制和十六進制表示的數值最終都將被轉換成十進制數值。
十六進制
var num = 0xA;
數字序列範圍：0~9以及A~F
八進制
var num1 = 07; //對應十進制的7
var num2 = 019; //對應十進制的19
var num3 = 08; //對應十進制的8
數字序列範圍：0~7
若是字面值中的數值超出了範圍，那麼前導零將被忽略，後面的數值將被看成十進制數值解析

Number類型

浮點數
var n = 5e-324;
浮點數值的最高精度是 17 位小數，但在進行算術計算時其精確度遠遠不如整數
var result = 0.1 + 0.2; // 結果不是 0.3，而是：0.30000000000000004
console.log(0.07 * 100);
永遠不要測試某個特定的浮點數值(不要判斷兩個浮點數是否相等)

數值範圍

因爲內存的限制，ECMAScript 並不能保存世界上全部的數值
最小值：Number.MIN_VALUE，這個值爲： 5e-324
最大值：Number.MAX_VALUE，這個值爲： 1.7976931348623157e+308
無窮大：Infinity
無窮小：-Infinity

數值檢測

NaN 非數值（Not a Number）
console.log(「abc」/18); //結果是NaN
NaN 與任何值都不相等，包括 NaN 自己
isNaN() :任何不能被轉換爲數值的值都會致使這個函數返回 true
isNaN(NaN);// true
isNaN(「blue」); // true
isNaN(123); // false

String類型

字符串字面量
var name = "zhangsan"; //"zhangsan"字面量
字符串要用引號引發，單引號和雙引號的做用是等效的
例如：
var name = "zhangsan";
var name = 'zhangsan';
var name = 'zhangsan"; //錯誤，單引號和雙引號要成對出現
字符串是由一個一個字符組成的，獲取一個字符串中字符的個數可使用length
例如：var name="zs"; alert(name.length);//2

轉義符

要想打印"或者'怎麼辦？
var str = "hello \"itcast\""; //打印輸出hello "itcast"
轉義符

 

 

字符串的不可變

ECMAScript 中的字符串是不可變的，也就是說，字符串一旦建立，它們的值就不能改變。
要改變某個變量保存的字符串，首先要銷燬原來的字符串，而後再用另外一個包含新值的字符串填充該變量
例如：
var str = "123"; str = str + "abc";

字符串拼接

若是有兩個字符串變量a,b，如何把這兩個變量的值鏈接起來？
例如：
var a = "hello";
var b = " itcast";
var c = a + b;
-思考：
var a = 「100";
var b = 100;
var c = a - b; //結果是什麼？

Boolean類型

Boolean類型有兩個字面量：true和false，而且區分大小寫！
雖然Boolean 類型的字面值只有兩個，但 ECMAScript 中全部類型的值都有與這兩個 Boolean 值等價的值
例如：
var result = Boolean("a");
console.log(result); //結果是true

var result = Boolean(100);
console.log(result); //結果是true

轉換成Boolean類型

任何類型能夠轉換成Boolean類型，通常使用在流程控制語句後面
例如：
var message = "hello";
if(message) { alert(message + " world") };

 

Undefined類型

Undefined這是一種比較特殊的類型，表示變量未賦值，這種類型只有一種值就是undefined
例如：
var message;
console.log(message); //結果是undefined
undefined是Undefined類型的字面量。
例如：
var message = undefined;
console.log(message);
typeof message; 獲取到的是"undefined"

思考
下面代碼輸出的結果？
var message;
if (message) {
alert("有值");
}else{
alert("無值");
}

目標
掌握三種類型的轉換
轉換成字符串類型
轉換成數值類型
轉換成布爾類型

轉換成字符串

三種轉換成字符的方法
一、幾乎每個值都有toString()方法
例如：
var age = 18;
var ageString = age.toString();
console.log(ageString); // 結果 "18"
var result = true;
var resultString = result.toString();
console.log(resultString);// 結果 "true"
數值類型的toString()，能夠攜帶一個參數，輸出對應進制的值
var num = 10;
console.log(num.toString()); //"10" 默認是10進制
console.log(num.toString(10));//"10"
console.log(num.toString(8)); //"12"
console.log(num.toString(16));//"a"
console.log(num.toString(2)); //"1010"

三個把值轉換成數值類型的函數：Number()、 parseInt()、 parseFloat()
parseFloat()把字符串轉換成浮點數
parseFloat()和parseInt很是類似，不一樣之處在與
parseFloat會解析第一個. 遇到第二個.或者非數字結束
parseFloat不支持第二個參數，只能解析10進制數
若是解析的內容裏只有整數，解析成整數

轉換成布爾類型

兩種轉換布爾類型的方式
Boolean()函數
例如：
var b = Boolean("123"); //返回yes
流程控制語句會把後面的值隱式轉換成布爾類型
例如：
var message;
if (message) { //會自動把message轉換成false
//todo...
}
轉換爲false的值：false、""、0和NaN、null、undefined

猜猜看，下面的語句的結果
var b = !!"123";

第一個邏輯非操做會基於不管什麼操做數返回一個布爾值
第二個邏輯非操做則對該布爾值求反
因而就獲得了這個值真正對應的布爾值（結合性從右向左）

目標
算數運算符
一元運算符
邏輯運算符 (&& || !)
比較運算符
賦值運算符
運算符的優先級

 數學運算符

+ 加法運算符
若是運算符，有一個操做數爲字符串則將另外一個操做數轉換成字符串而後再將兩個字符串拼接
例如：
var str = "abc" + 123; //返回"abc123"
- 減法運算符
* 乘法運算符
/ 除法運算符
% 求模(取餘)運算符
/ 除0，返回Infinity
% 取餘，返回NaN

運算符	結果
+	若是是數字類型的變量相加，那麼結果爲數字類型   若是是非數字類型的變量相加，結果爲字符串類型
-	若是是非數字類型的變量相減結果爲  NaN
*	同上
/	同上 ，若是0做爲除數，結果爲infinity（無窮大）
%	獲取餘數
()	優先級  有括號先計算括號裏面的值

 一元運算符

只能操做一個值的操做符叫作一元操做符，分爲：前置型和後置型
顧名思義，前置型應該位於要操做的變量以前，然後置型則應該位於要操做的變量以後
執行前置遞增和遞減操做時，變量的值都是在語句被求值之前改變的。

 

++
前置++
var age = 18;
++age; //結果 19
執行過程
var age = 1;
age = age + 1;
後置++
var age = 18;
age++; //結果 19
和前置++的不一樣點在於，遞增操做是在整個語句求值以後執行的，此處和上面的結果沒有任何區別。
練習：
var a = 1; var b = ++a + ++a; console.log(b);
var a = 1; var b = a++ + ++a; console.log(b);
var a = 1; var b = a++ + a++; console.log(b);
var a = 1; var b = ++a + a++; console.log(b);
--和++相同

邏輯運算符

&& 與
屬於*短路操做*，即若是第一個操做數可以決定結果，那麼就不會再對第二個操做數求值
只有兩個操做數都爲true，結果爲true
只要有一個操做數爲false，結果爲false
|| 或
屬於*短路操做*，若是第一個操做數的求值結果爲true ，就不會對第二個操做數求值了
有一個操做數爲true，結果爲true
有一個操做數false，結果爲false
! 非
邏輯非操做符首先會將它的操做數轉換爲一個布爾值，而後再對其求反
只有一個操做數

短路操做：
與
若是第一個操做數是對象，返回第二個操做數
若是第二個操做數是對象，而且第一個操做數是true返回第二個操做數
若是有一個操做數是null（NaN/undefined），返回null（NaN/undefined）
或
若是第一個操做數是對象，返回第一個操做數
若是第二個操做數是對象，而且第一個操做數是false返回第二個操做數
若是兩個操做數都是對象，返回第一個操做數
若是兩個操做數都是是null（NaN/undefined），返回null（NaN/undefined）
非

練習：
非
若是操做數是對象，返回false
若是操做數是空字符串，返回true
若是操做數是非空字符串，返回false
若是操做數是0，返回true
若是操做數是任意非0值，返回false
若是操做數是null,undefined,NaN，返回true
上面的規則能夠簡化成
轉換爲false的值：false、""、0和NaN、null、undefined
!!"abc"結果是什麼

比較運算符

 

< <= >= >
在比較字符串時，實際比較的是兩個字符串中對應位置的每一個字符的字符編碼值。
在比較數值和字符串時，字符串都會被轉換成數值，而後再以數值方式與另外一個數值比較
若是一邊是數子，另外一邊是Boolean，先把Boolearn類型的值轉換成數字，再比較

== != 相等和不相等
=== !== 全等和不全等
相等只比較值，全等比較的是值和類型
例如：
var result = "55" == 55; //true
var result = "55" === 55; //false 值相等，類型不相等
var result = 55 === 55; //true

賦值運算符

= += -= *= /= %=
例如：
var num = 0;
num += 5;//至關於 num = num + 5;

 

運算符的優先級

優先級從高到底
() 優先級最高
一元運算符 ++ -- !
算數運算符 先* / % 後 + -
關係運算符 > >= < <=
相等運算符 == != === !==
邏輯運算符 先&& 後||

 

 

練習1
((4 >= 6) || ("人" != "狗")) && !(((12 * 2) == 144) && true)
練習2
var num = 10;
if(5 == num / 2 && (2 + 2 * num).toString() === "22") {
console.log(true);
}

 Date()對象

Date對象用於處理日期和時間。

Math對象

Math.ceil()   天花板函數    向上取整

★若是是整數，取整以後是這個數自己

★若是是小數，對數進行向上舍入。

 

Math.floor()  地板函數

★若是是整數，取整以後是這個數自己

★若是是小數，對數進行向下舍入。

 

Math.max()

 

 

Math.min()

 

 Math.pow()

 

 

Math.round() 

 

Math.random()

 

 

數據類型轉換

１.1 數字類型轉字符串

  String()

 變量.toString()

 

１.2 字符串轉數字類型

◆Number

 

  ★數字類型的字符串，轉換以後獲得的數字。

  ★非數字字符串，轉換以後獲得是NaN。

  ★小數類型的字符串，轉換以後獲得的是原數字。

◆parseInt

 

★整數數字類型的字符串，轉換以後獲得的整數數字。

★數字開頭的字符串，轉換以後獲得的是前邊的數字。

★非數字開頭的字符串，轉換以後獲得的是NaN。

★小數類型的字符串，轉換以後取整。

◆parseFloat

★整數數字類型的字符串，轉換以後獲得的整數數字。

★數字開頭的字符串，轉換以後獲得的是前邊的數字。

★非數字開頭的字符串，轉換以後獲得的是NaN。

★小數類型的字符串，轉換以後獲得的是原數字。

１.3 轉布爾類型

Boolean()

 

 

★數字和字符串轉完以後爲true。

★undefined、null、0轉完以後爲false.

１.4 隱式數據類型轉換

在運算過程當中，程序本身進行的數據轉換(程序員沒有操做)

１.5 邏輯運算符

邏輯運算只有2個結果，一個爲true,一個爲false.

◆且&&

★兩個表達式爲true的時候，結果爲true.

◆或||

★只要有一個表達式爲true,結果爲true.

◆非！

★和表達式相反的結果。

1.6  等號運算符

「=」賦值運算符

「==」只判斷內容是否相同，不判斷數據類型。

「===」不只判斷內容，還判斷數據類型是否相同。

！=  只判斷內容是否不相同，不判斷數據類型。

！==不全等於  不只判斷內容是否不相同，還判斷數據類型是否不相同。

1.7 變量的集體聲明

 

程序三種基本結構

順序結構
選擇結構
循環結構

判斷語句if

語法：
if(condition) {
statement1
}else if (aaa){
statement2
}else{
statement3
}

三元(目)運算符

性別在數據庫中存儲的是1和0，要求輸出男或女
var sex = 1;
if(sex === 1) {
console.log("男");
}else{
console.log("女");
}
簡化的方式
var sex = 1;
sex = sex === 1 ? "男":"女";
表達式1 ? 表達式2 : 表達式3

判斷語句switch

語法：
switch (expression) {
case value:
statement
break; // break 關鍵字會致使代碼執行流跳出 switch 語句
case value:
statement
break;
default:
statement
}
注意：
break能夠省略，若是省略，代碼會繼續執行下一個case
switch 語句在比較值時使用的是全等操做符，所以不會發生類型轉換（例如，字符串 "10" 不等於數值 10）。

案例：

     var fruit=prompt("請輸入您喜歡吃的水果");
     switch(fruit){
         case "蘋果":
         alert("您喜歡吃的是蘋果");
         break;  //阻斷代碼執行
         case "香蕉":
         alert("您喜歡吃的是香蕉");
         break;
         case "葡萄":
         alert("您喜歡吃的是葡萄");
         break;
         default:
         alert("口味真重");
         break;
     }

     switch(fruit){
         case "蘋果": case "香蕉": case "葡萄":// case值的集體聲明
         alert("您喜歡吃水果");
         break;
         default:
         alert("口味真重");
         break;
     }

練習：
判斷當天是星期幾

    var jj=prompt("請輸入月份");
    switch(jj){
        case "3": case "4": case "5":
        alert("春季");
        break;
        case "6": case "7": case "8":
        alert("夏季");
        break;
        case "9": case "10": case "11":
        alert("秋季");
        break;
        case "12": case "1": case "2":
        alert("冬季");
        break;
        default:
        alert("您在火星");
        break;
    }

View Code

把百分制轉換成優良中可差

    var score=prompt("請輸入成績");
    switch(score){
        case "20":
        alert("成績爲20");
        break;
        case "40":
        alert("成績爲40");
        break;
        case "60":
        alert("成績爲60");
        break;
        default:
        alert("輸入錯誤");
        break;
    }

View Code

 

循環語句for

語法
for (initialization; expression; post-loop-expression) statement
initialization表示：初始化表達式
expression表示：控制表達式
post-loop-expression表示：循環後表達式
三者都是可選的
循環1-100
執行過程
1 首先初始化
2 循環的判斷
3 函數體代碼
4 post-loop-expression
5 從第2步開始向下重複進行

 

練習：
1 打印1到100

    //將1-10的數字打印到控制檯
    for(var n1=1; n1<=10; n1++){
            console.log(n1);
    }

View Code

2 打印1到100的和

    // 計算1到100的和 
    var sum=0;
    for(var n1=1; n1<=100; n1++){
        sum=sum+n1;

    }
    console.log(sum);

View Code

3 求1-100之間全部數的和、平均值
4 求1-100之間全部偶數的和、全部奇數的和
5 本金10000元存入銀行，年利率是千分之三，每過1年，將本金和利息相加做爲新的本金。計算5年後，得到的本金是多少？
6 有我的想知道，一年以內一對兔子能繁殖多少對？因而就築了一道圍牆把一對兔子關在裏面。已知一對兔子每月能夠生一對小兔子，而一對兔子從出生後第3個月起每個月生一對小兔子。假如一年內沒有發生死亡現象，那麼，一對兔子一年內（12個月）能繁殖成多少對？
兔子的規律爲數列，1，1，2，3，5，8，13，21

 

2 打印正方形
3 打印直角三角形

    // 在頁面中打印一個直角三角形
    for(var j=1; j<=9;j++){
        for(var i=1; i<=j; i++){
            document.write("*");
        }document.write("<br>");
    }

View Code

 

1 打印9*9乘法表

    // 在頁面中打印99乘法表
    for(var j=1; j<=9; j++){
        for(i=1;i<=j; i++){
            document.write(i+"X"+j+"="+j*i+"&nbsp;");
        }document.write("<br>");
    }

View Code

 

從1乘到100；
計算出1—100之間全部不能被7整除的整數的數字之和。
計算出1—100之間全部不能被3整除的整數的和大於(或等於)2000的數字。

break和continue

break語句

在循環體中，只要代碼遇到break，程序立馬結束當前循環。

當前循環指的是break語句全部的循環體。

當即退出循環

案例：

    //輸出找到1-100之間的全部質數
    var flag=0;  //標識符
    for(var j=1; j<=100; j++){
        for(var i=2; i<j; i++){
            if(j%i==0){
                flag=1;
                break;

            }else{
                flag=0;
            }
        }
        if(flag==0 && j!=1){
            console.log(j);
        }
    }

continue語句

continue跳出本次循環
當即退出當前循環，但退出循環後會從循環的頂部繼續執行

案例

    //將6之外的1-10數字打印到控制檯
    for(var n1=1; n1<=10; n1++){
        if(n1==6){
            continue;
        }else{
            console.log(n1);
        }
    }

    // 請將1到100之間全部數字輸出，排除是3的倍數的數字
    for(var i=1; i<=100; i++){
        if(i%3==0){
            continue;
        }else{
            console.log(i);
        }
    }

break和continue的區別：

比如報數1到10，break語句報道6中止後面不報了（123456），continue跳過6繼續報後面的數（12345 789）。

 

循環語句while

語法
while(expression) statement
執行順序
1. 先執行expression
2. 再執行循環體中的代碼

    //將1到100之間的全部是3的倍數找出來，在控制檯中輸出
    var n1=1;
    while(n1>=1 && n1<=10){
        if(n1%3==0){
            console.log(n1);
        }else{

        }
        n1++;
    }

    // 求1到100之間的數字和。在控制檯中輸出
     var n1=1;
     var sum=0;
     while(n1>=1 && n1<=10){
         sum=sum+n1;
         n1++;

     }

     //親，請將1到50中全部的奇數找出來，並在控制檯中輸出！
     var n1=1;
     while(n1>=1 && n1<=50){
         if(n1%2==0){
             
         }else{
             console.log(n1);
         }
         n1++;
     }

練習
任意輸入一個整數，求它的位數

循環語句do..while

語法
do {statement} while (expression);
循環體中的代碼至少要被執行一次
執行順序
1. 先執行statement語句
2. 再執行expression

    var n1=1;
    var n2=5;
        do{
            alert("n1>n2");
        }while(n1>n2)
        

爲何要學習數組

以前學習的數據類型，只能存儲一個值
咱們想存儲多個值的時候可使用數組
好比：存儲班級中全部學生的姓名

 

數組

數組：數據的有序列表，能夠存聽任意類型的數據，數組的大小能夠動態調整。
建立數組的兩種方式
方式1，數組字面量
var arr1 = []; //建立一個空數組，數組字面量
var arr2 = [1, 3, 4]; //建立一個包含3個數值的數組，多個數組項以逗號隔開
var arr3 = ["a", "c"]; // 建立一個包含2個字符串的數組
方式2，Array的構造函數
var arr4 = new Array(); // 建立一個空數組
var arr5 = new Array(10); // 建立一個長度爲10的數組
var arr6 = new Array("black", "white", "red"); // 建立一個包含3個字符串的數組

數組的使用

獲取數組中的值
var colors = ["black", "white", "red"];
console.log(colors[0]); //獲取第一個元素的值
colors["1"] = "blue"; //給第2個元素從新賦值
console.log(colors);
colors["4"] = "yellow"; //設置第5個元素的值，此時數組中有5個元素
console.log(colors);
length屬性，獲取或設置數組中元素的個數
console.log(colors.length);//獲取數組中元素的個數
colors.length = 1; //設置數組中元素的個數
console.log(colors);

數組練習

求一組數中的全部數的和 和平均值
求一組數中的最大值和最小值，以及所在位置
將字符串數組用|或其餘符號分割
要求將數組中的0項去掉，將不爲0的值存入一個新的數組，生成新的數組
翻轉數組
冒泡排序，從小到大

 

調試

過去的調試
alert
console.log
設置斷點

函數

函數能夠封裝一段JavaScript代碼，它只定義一次，但能夠被執行或調用任意屢次
編程就是把需求分解成一組函數與數據結構的能力
函數的定義
function 函數名 (var1, var2, ..., varX) {
//函數體
}
函數的調用

函數名();

函數函數的幾種形式
無參數無返回值
有參數無返回值
無參數有返回值
有參數有返回值
函數返回值
若是函數體中出現return則後面的代碼不執行
當不寫返回值，或者return後面沒有跟內容的時候返回的也有返回值undefined，這是和其它語言不一樣的地方

函數的返回值

JavaScript中的函數比較奇葩
1. 若是函數沒有顯示的使用 return語句 ，那麼函數有默認的返回值：undefined
2. 若是函數使用 return語句，那麼跟再return後面的值，就成了函數的返回值
3. 若是函數使用 return語句，可是return後面沒有任何值，那麼函數的返回值也是：undefined
4. 函數使用return語句後，這個函數會在執行完 return 語句以後中止並當即退出，也就是說return後面的全部其餘代碼都不會再執行。
5. 推薦的作法是要麼讓函數始終都返回一個值，要麼永遠都不要返回值。
函數的參數

函數的參數

形參
function f(a,b){} //a,b是形參，佔位用，函數定義時形參無值
實參
var x= 5,y=6;
f(x,y); //x,y實參，有具體的值，會把x,y複製一份給函數內部的a和b，函數內部的值是複製的新值，沒法修改外部的x,y
JavaScript中的函數相對於其它語言的函數比較靈(特)活(殊)
在其它語言中實參個數必須和形參個數一致，可是JavaScript中沒有函數簽名的概念，實參個數和形參個數能夠不相等

沒有重載(瞭解)
什麼是重載：方法的簽名相同(函數返回值、函數名稱、函數參數)，其它語言(c++、Java、c#)中有方法的重載。
JavaScript中沒有方法的重載
function f1(a,b) {
return a + b;
}
function f1(a,b,c) {
return a + b + c;
}
var result = f1(5,6); //NaN
三個參數的f1把兩個參數的f1覆蓋，調用的是三個參數的f1
證實JavaScript中沒有重載

函數兩種定義方式

一、函數聲明
function f(a,b) {
return a + b;
}
console.log(f(5,6));
二、函數表達式
//myFun和f等價
var myFun = function (a,b){
return a + b;
}
console.log(myFun(6,7));

變量的做用域

塊級做用域
在其它語言中，任何一對花括號中的語句都屬於一個塊，在這之中定義的全部變量在代碼塊外都是不可見的
JavaScript中沒有塊級做用域
全局變量
定義在script或者不屬於某個函數的變量
局部變量
定義在函數內部的變量
其它
函數內部能夠訪問到該函數所屬的外部做用域的變量(做用域鏈)
不使用var聲明的變量是全局變量，不推薦使用。
變量退出做用域以後會銷燬，全局變量關閉網頁或瀏覽器纔會銷燬

變量提高

變量提高
定義變量的時候，變量的聲明會被提高到做用域的最上面，變量的賦值不會提高。
函數提高
JavaScript解析器首先會把當前做用域的函數聲明提早到整個做用域的最前面

函數聲明和函數表達式的區別
函數聲明
//此處的代碼執行沒有問題，JavaScript解析器首先會把當前做用域的函數聲明提早到整個做用域的最前面。
console.log(f(5,6));
function f(a,b) {
return a + b;
}
函數表達式
//報錯：myFun is not a function
//這是爲何呢
myFun(6,7);
var myFun = function (a,b){
return a + b;
}

匿名函數

匿名函數：沒有命名的函數
做用：通常用在綁定事件的時候
語法
function () {}
自調用函數
(function(){alert("hello")})();

函數練習
求圓的面積
求2個數中的最大值，求3個數中的最大值
判斷一個數是不是素數
求階乘
求1!+2!+3!+....+n!
求一組數中的最大值和最小值
求斐波那契數列Fibonacci中的第n個數是多少？ 1 1 2 3 5 8 13 21...
翻轉數組，返回一個新數組
對數組排序，從小到大
輸入某年某月某日，判斷這一天是這一年的第幾天？

遞歸

什麼是遞歸？
方法自身調用，通常還要有結束的提交
案例：
從前有座廟，廟裏有個老和尚
求n個數的累加
輸入一個數，求這個數的各位數字之和。
求Fibonacci的第n個數
1 1 2 3 5 8 13 21...

函數是一種數據類型
typeof f1

函數做爲方法的參數
函數做爲方法的返回值

 

１.1 帶操做的賦值運算符