天天看點

js學習10---js基礎JavaScript 資料類型JavaScript 錯誤 - throw、try 和 catchJavaScript 嚴格模式(use strict)JavaScript this 關鍵字JavaScript let 和 constavaScript JSON

js可以更可廣泛用于伺服器(我的領域)、PC、筆記本電腦、平闆電腦和智能手機等裝置。

ECMA-262 是 JavaScript 标準的官方名稱。

JavaScript 由 Brendan Eich 發明。它于 1995 年出現在 Netscape 中(該浏覽器已停止更新),并于 1997 年被 ECMA(一個标準協會)采納。

ECMAScript 版本

JavaScript 已經由 ECMA(歐洲電腦制造商協會)通過 ECMAScript 實作語言的标準化。

年份 名稱 描述
1997 ECMAScript 1 第一個版本
1998 ECMAScript 2 版本變更
1999 ECMAScript 3

添加正規表達式 

添加 try/catch

ECMAScript 4 沒有釋出
2009 ECMAScript 5

添加 "strict mode",嚴格模式

添加 JSON 支援

2011 ECMAScript 5.1 版本變更
2015 ECMAScript 6 添加類和子產品
2016 ECMAScript 7

增加指數運算符 (**)

增加 Array.prototype.includes

ECMAScript 6 也稱為 ECMAScript 2015。

ECMAScript 7 也稱為 ECMAScript 2016。

使用 console.log() 寫入到浏覽器的控制台

<!DOCTYPE html>

<html>

<head></head>

<body>

    <script>

        var a=1;

        var b=3;

        console.log(a+b);

    </script>

</body>

</html>

js學習10---js基礎JavaScript 資料類型JavaScript 錯誤 - throw、try 和 catchJavaScript 嚴格模式(use strict)JavaScript this 關鍵字JavaScript let 和 constavaScript JSON

JavaScript 字面量

數字(Number)字面量 可以是整數或者是小數,或者是科學計數(e)。

字元串(String)字面量 可以使用單引号或雙引号:

數組(Array)字面量 定義一個數組:

[40, 100, 1, 5, 25, 10]

對象(Object)字面量 定義一個對象:

{firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}

函數(Function)字面量 定義一個函數:

function myFunction(a, b) { return a * b;}

JavaScript 使用關鍵字 var 來定義變量, 使用等号來為變量指派:在指令式語言中,變量通常是可變的。字面量是一個恒定的值。

JavaScript 資料類型

JavaScript 有多種資料類型:數字,字元串,數組,對象等等:

var length = 16;                                  // Number 通過數字字面量指派 

var points = x * 10;                              // Number 通過表達式字面量指派

var lastName = "Johnson";                         // String 通過字元串字面量指派

var cars = ["Saab", "Volvo", "BMW"];              // Array  通過數組字面量指派

var person = {firstName:"John", lastName:"Doe"};  // Object 通過對象字面量指派

JavaScript 字元集

JavaScript 使用 Unicode 字元集。

JavaScript 語句辨別符

JavaScript 語句通常以一個 語句辨別符 為開始,并執行該語句。

語句辨別符是保留關鍵字不能作為變量名使用。

下表列出了 JavaScript 語句辨別符 (關鍵字) :

語句 描述
break 用于跳出循環。
catch 語句塊,在 try 語句塊執行出錯時執行 catch 語句塊。
continue 跳過循環中的一個疊代。
do ... while 執行一個語句塊,在條件語句為 true 時繼續執行該語句塊。
for 在條件語句為 true 時,可以将代碼塊執行指定的次數。
for ... in 用于周遊數組或者對象的屬性(對數組或者對象的屬性進行循環操作)。
function 定義一個函數
if ... else 用于基于不同的條件來執行不同的動作。
return 退出函數
switch 用于基于不同的條件來執行不同的動作。
throw 抛出(生成)錯誤 。
try 實作錯誤處理,與 catch 一同使用。
var 聲明一個變量。
while 當條件語句為 true 時,執行語句塊。

Unicode 覆寫了所有的字元,包含标點等字元。

Value = undefined

在計算機程式中,經常會聲明無值的變量。未使用值來聲明的變量,其值實際上是 undefined。

在執行過以下語句後,變量 carname 的值将是 undefined:

var carname;

Undefined 和 Null

Undefined 這個值表示變量不含有值。

可以通過将變量的值設定為 null 來清空變量。

執行個體

cars=null;

person=null;

JavaScript 資料類型

值類型(基本類型):字元串(String)、數字(Number)、布爾(Boolean)、對空Null)、未定義(Undefined)、Symbol。

引用資料類型:對象(Object)、數組(Array)、函數(Function)。

注:Symbol 是 ES6 引入了一種新的原始資料類型,表示獨一無二的值。

JavaScript 數組

下面的代碼建立名為 cars 的數組:

var cars=new Array();

cars[0]="Saab";

cars[1]="Volvo";

cars[2]="BMW";

或者 (condensed array):

var cars=new Array("Saab","Volvo","BMW");

或者 (literal array):

執行個體

var cars=["Saab","Volvo","BMW"];

JavaScript 擁有動态類型

JavaScript 擁有動态類型。這意味着相同的變量可用作不同的類型:

JavaScript 對象

對象由花括号分隔。在括号内部,對象的屬性以名稱和值對的形式 (name : value) 來定義。屬性由逗号分隔:

var person={firstname:"John", lastname:"Doe", id:5566};

上面例子中的對象 (person) 有三個屬性:firstname、lastname 以及 id。

空格和折行無關緊要。聲明可橫跨多行:

var person={

firstname : "John",

lastname  : "Doe",

id        :  5566

};

對象屬性有兩種尋址方式:

執行個體

name=person.lastname;

name=person["lastname"];

但是,我們通常認為 "JavaScript 對象是鍵值對的容器"。

鍵值對通常寫法為 name : value (鍵與值以冒号分割)。

鍵值對在 JavaScript 對象通常稱為 對象屬性。

局部 JavaScript 變量

在 JavaScript 函數内部聲明的變量(使用 var)是局部變量,是以隻能在函數内部通路它。(該變量的作用域是局部的)。

您可以在不同的函數中使用名稱相同的局部變量,因為隻有聲明過該變量的函數才能識别出該變量。

隻要函數運作完畢,本地變量就會被删除。

全局 JavaScript 變量

在函數外聲明的變量是全局變量,網頁上的所有腳本和函數都能通路它。

JavaScript 變量的生存期

JavaScript 變量的生命期從它們被聲明的時間開始。

局部變量會在函數運作以後被删除。

全局變量會在頁面關閉後被删除。

字元串屬性

屬性 描述
constructor 傳回建立字元串屬性的函數
length 傳回字元串的長度
prototype 允許您向對象添加屬性和方法

字元串方法

更多方法執行個體可以參見:JavaScript String 對象。

方法 描述
charAt() 傳回指定索引位置的字元
charCodeAt() 傳回指定索引位置字元的 Unicode 值
concat() 連接配接兩個或多個字元串,傳回連接配接後的字元串
fromCharCode() 将 Unicode 轉換為字元串
indexOf() 傳回字元串中檢索指定字元第一次出現的位置
lastIndexOf() 傳回字元串中檢索指定字元最後一次出現的位置
localeCompare() 用本地特定的順序來比較兩個字元串
match() 找到一個或多個正規表達式的比對
replace() 替換與正規表達式比對的子串
search() 檢索與正規表達式相比對的值
slice() 提取字元串的片斷,并在新的字元串中傳回被提取的部分
split() 把字元串分割為子字元串數組
substr() 從起始索引号提取字元串中指定數目的字元
substring() 提取字元串中兩個指定的索引号之間的字元
toLocaleLowerCase() 根據主機的語言環境把字元串轉換為小寫,隻有幾種語言(如土耳其語)具有地方特有的大小寫映射
toLocaleUpperCase() 根據主機的語言環境把字元串轉換為大寫,隻有幾種語言(如土耳其語)具有地方特有的大小寫映射
toLowerCase() 把字元串轉換為小寫
toString() 傳回字元串對象值
toUpperCase() 把字元串轉換為大寫
trim() 移除字元串首尾空白
valueOf() 傳回某個字元串對象的原始值

typeof 操作符

你可以使用 typeof 操作符來檢測變量的資料類型。

null

在 JavaScript 中 null 表示 "什麼都沒有"。

null是一個隻有一個值的特殊類型。表示一個空對象引用。

js學習10---js基礎JavaScript 資料類型JavaScript 錯誤 - throw、try 和 catchJavaScript 嚴格模式(use strict)JavaScript this 關鍵字JavaScript let 和 constavaScript JSON
用 typeof 檢測 null 傳回是object。

你可以設定為 null 來清空對象:

undefined

在 JavaScript 中, undefined 是一個沒有設定值的變量。

typeof 一個沒有值的變量會傳回 undefined。

undefined 和 null 的差別

執行個體

null 和 undefined 的值相等,但類型不等:

typeof undefined             // undefined

typeof null                  // object

null === undefined           // false

null == undefined            // true

JavaScript 資料類型

在 JavaScript 中有 5 種不同的資料類型:

  • string
  • number
  • boolean
  • object
  • function

2 個不包含任何值的資料類型:

  • null
  • undefined
  • NaN 的資料類型是 number
  • 數組(Array)的資料類型是 object
  • 日期(Date)的資料類型為 object
  • null 的資料類型是 object
  • 未定義變量的資料類型為 undefined

JavaScript 錯誤 - throw、try 和 catch

try 語句測試代碼塊的錯誤。

catch 語句處理錯誤。

throw 語句建立自定義錯誤。

 JavaScript 錯誤

當 JavaScript 引擎執行 JavaScript 代碼時,會發生各種錯誤。

可能是文法錯誤,通常是程式員造成的編碼錯誤或錯别字。

可能是拼寫錯誤或語言中缺少的功能(可能由于浏覽器差異)。

可能是由于來自伺服器或使用者的錯誤輸出而導緻的錯誤。

當然,也可能是由于許多其他不可預知的因素。

JavaScript 抛出(throw)錯誤

當錯誤發生時,當事情出問題時,JavaScript 引擎通常會停止,并生成一個錯誤消息。

描述這種情況的技術術語是:JavaScript 将抛出一個錯誤。

JavaScript try 和 catch

try 語句允許我們定義在執行時進行錯誤測試的代碼塊。

catch 語句允許我們定義當 try 代碼塊發生錯誤時,所執行的代碼塊。

JavaScript 語句 try 和 catch 是成對出現的。

文法

try { //在這裡運作代碼 } catch(err) { //在這裡處理錯誤 }

JavaScript 調試工具

在程式代碼中尋找錯誤叫做代碼調試。

調試很難,但幸運的是,很多浏覽器都内置了調試工具。

内置的調試工具可以開始或關閉,嚴重的錯誤資訊會發送給使用者。

有了調試工具,我們就可以設定斷點 (代碼停止執行的位置), 且可以在代碼執行時檢測變量。

浏覽器啟用調試工具一般是按下 F12 鍵,并在調試菜單中選擇 "Console" 。

JavaScript 嚴格模式(use strict)

JavaScript 嚴格模式(strict mode)即在嚴格的條件下運作。

使用 "use strict" 指令

"use strict" 指令在 JavaScript 1.8.5 (ECMAScript5) 中新增。

它不是一條語句,但是是一個字面量表達式,在 JavaScript 舊版本中會被忽略。

"use strict" 的目的是指定代碼在嚴格條件下執行。

嚴格模式下你不能使用未聲明的變量。

js學習10---js基礎JavaScript 資料類型JavaScript 錯誤 - throw、try 和 catchJavaScript 嚴格模式(use strict)JavaScript this 關鍵字JavaScript let 和 constavaScript JSON

支援嚴格模式的浏覽器:

Internet Explorer 10 +、 Firefox 4+ Chrome 13+、 Safari 5.1+、 Opera 12+。

嚴格模式聲明

嚴格模式通過在腳本或函數的頭部添加 "use strict"; 表達式來聲明。

執行個體中我們可以在浏覽器按下 F12 (或點選"工具>更多工具>開發者工具") 開啟調試模式,檢視報錯資訊。

JavaScript 标準

所有的現代浏覽器完全支援 ECMAScript 3(ES3,JavaScript 的第三版,從 1999 年開始)。

ECMAScript 4(ES4)未通過。

ECMAScript 5(ES5,2009 年釋出),是 JavaScript 最新的官方版本。

随着時間的推移,我們開始看到,所有的現代浏覽器已經完全支援 ES5。

JavaScript 保留關鍵字

Javascript 的保留關鍵字不可以用作變量、标簽或者函數名。有些保留關鍵字是作為 Javascript 以後擴充使用。

abstract arguments boolean break byte
case catch char class* const
continue debugger default delete do
double else enum* eval export*
extends* false final finally float
for function goto if implements
import* in instanceof int interface
let long native new null
package private protected public return
short static super* switch synchronized
this throw throws transient true
try typeof var void volatile
while with yield

* 标記的關鍵字是 ECMAScript5 中新添加的。

JavaScript this 關鍵字

面向對象語言中 this 表示目前對象的一個引用。

但在 JavaScript 中 this 不是固定不變的,它會随着執行環境的改變而改變。

  • 在方法中,this 表示該方法所屬的對象。
  • 如果單獨使用,this 表示全局對象。
  • 在函數中,this 表示全局對象。
  • 在函數中,在嚴格模式下,this 是未定義的(undefined)。
  • 在事件中,this 表示接收事件的元素。
  • 類似 call() 和 apply() 方法可以将 this 引用到任何對象。
  • JavaScript let 和 const

    ECMAScript 2015(ECMAScript 6)

    ES2015(ES6) 新增加了兩個重要的 JavaScript 關鍵字: let 和 const。

    let 聲明的變量隻在 let 指令所在的代碼塊内有效。

    const 聲明一個隻讀的常量,一旦聲明,常量的值就不能改變。

    在 ES6 之前,JavaScript 隻有兩種作用域: 全局變量 與 函數内的局部變量。

  • JavaScript 塊級作用域(Block Scope)

    使用 var 關鍵字聲明的變量不具備塊級作用域的特性,它在 {} 外依然能被通路到。

    { 
        var x = 2; 
    }
    // 這裡可以使用 x 變量      

    在 ES6 之前,是沒有塊級作用域的概念的。

    ES6 可以使用 let 關鍵字來實作塊級作用域。

    let 聲明的變量隻在 let 指令所在的代碼塊 {} 内有效,在 {} 之外不能通路。

    { 
        let x = 2;
    }
    // 這裡不能使用 x 變量      
  • 浏覽器支援

    Internet Explorer 11 及更早版本的浏覽器不支援 let 關鍵字。

    下表列出了各個浏覽器支援 let 關鍵字的最低版本号。

    Chrome 49 IE / Edge 12 Firefox 44 Safari 11 Opera 36
    Mar, 2016 Jul, 2015 Jan, 2015 Sep, 2017 Mar, 2016
  • 并非真正的常量

    const 的本質: const 定義的變量并非常量,并非不可變,它定義了一個常量引用一個值。使用 const 定義的對象或者數組,其實是可變的。下面的代碼并不會報錯:

    執行個體

    // 建立常量對象
  • const car = {type:"Fiat", model:"500", color:"white"};
  • // 修改屬性:
  • car.color = "red"; // 添加屬性 car.owner = "Johnson";
  • 浏覽器支援

    Internet Explorer 10 及更早版本的浏覽器不支援 const 關鍵字。

    下表列出了各個浏覽器支援 const 關鍵字的最低版本号。

    Chrome 49 IE / Edge 11 Firefox 36 Safari 10 Opera 36
    Mar, 2016 Oct, 2013 Feb, 2015 Sep, 2016 Mar, 201
  • avaScript JSON

    JSON 是用于存儲和傳輸資料的格式。

    JSON 通常用于服務端向網頁傳遞資料 。

    什麼是 JSON?

  • JSON 英文全稱 JavaScript Object Notation
  • JSON 是一種輕量級的資料交換格式。
  • JSON是獨立的語言 *
  • JSON 易于了解。
  • js學習10---js基礎JavaScript 資料類型JavaScript 錯誤 - throw、try 和 catchJavaScript 嚴格模式(use strict)JavaScript this 關鍵字JavaScript let 和 constavaScript JSON

    * JSON 使用 JavaScript 文法,但是 JSON 格式僅僅是一個文本。

    文本可以被任何程式設計語言讀取及作為資料格式傳遞。

  • JSON 對象

    JSON 對象儲存在大括号内。

    就像在 JavaScript 中, 對象可以儲存多個 鍵/值 對:

    {"name":"Runoob", "url":"www.acrunoob.com"}

    JSON 數組

    JSON 數組儲存在中括号内。

    就像在 JavaScript 中, 數組可以包含對象:

    "sites":[ {"name":"Runoob", "url":"www.runoob.com"}, {"name":"Google", "url":"www.google.com"}, {"name":"Taobao", "url":"www.taobao.com"} ]

  • 相關函數

    函數 描述
    JSON.parse() 用于将一個 JSON 字元串轉換為 JavaScript 對象。
    JSON.stringify() 用于将 JavaScript 值轉換為 JSON 字元串。