前端基礎之JavaScript

標籤：name   nan   model   python   字母   資料類型   執行   不同的   var   

JavaScript概述JavaScript的曆史

• 1992年Nombas開發出C-minus-minus(C--)的嵌入式指令碼語言(最初綁定在CEnvi軟體中).後將其改名ScriptEase.(用戶端執行的語言)
• Netscape(網景)接收Nombas的理念,(Brendan Eich)在其Netscape Navigator 2.0產品中開發出一套livescript的指令碼語言.Sun和Netscape共同完成.後改名叫Javascript
• 微軟隨後模仿在其IE3.0的產品中搭載了一個JavaScript的複製版叫Jscript.
• 為了統一三家,ECMA(歐洲電腦製造協會)定義了ECMA-262規範.國際標準組織及國際電子電機委員會（ISO/IEC）也採納 ECMAScript 作為標準（ISO/IEC-16262）。從此，網頁瀏覽器就開始努力（雖然有著不同的程度的成功和失敗）將 ECMAScript 作為 JavaScript 實現的基礎。EcmaScript是規範.

ECMAScript

儘管 ECMAScript 是一個重要的標準，但它並不是 JavaScript 唯一的部分，當然，也不是唯一被標準化的部分。實際上，一個完整的 JavaScript 實現是由以下 3 個不同部分組成的：

• 核心（ECMAScript） 
• 文件物件模型（DOM） Document object model (整合js，css，html)
• 瀏覽器物件模型（BOM） Broswer object model（整合js和瀏覽器）
• Javascript 在開發中絕大多數情況是基於對象的.也是物件導向的.

簡單地說，ECMAScript 描述了以下內容：

• 文法 
• 類型 
• 語句 
• 關鍵字 
• 保留字 
• 運算子 
• 對象 (封裝 繼承 多態) 基於對象的語言.使用對象.

JavaScript引入方式Script標籤內寫代碼

<script>  // 在這裡寫你的JS代碼</script>

　　

引入額外的JS檔案

<script src="myscript.js"></script>

　　

JavaScript語言規範注釋（注釋是代碼之母）

// 這是單行注釋/*這是多行注釋*/

結束符

JavaScript中的語句要以分號（;）為結束符。

JavaScript語言基礎變數聲明

1. JavaScript的變數名可以使用_，數字，字母，$組成，不能以數字開頭。
2. 聲明變數使用 var 變數名; 的格式來進行聲明

var name = "貝貝";var age = 18;

　　

注意：

變數名是區分大小寫。

推薦使用駝峰式命名規則。

JavaScript資料類型

JavaScript擁有動態類型

var x;  // 此時x是undefinedvar x = 1;  // 此時x是數字var x = "貝貝"  // 此時x是字串 

　　

數字類型

JavaScript不區分整型和浮點型，就只有一種數字類型。

var a = 12.34;var b = 20;var c = 123e5;  // 12300000var d = 123e-5;  // 0.00123

　　

常用方法：

parseInt("123")  // 返回123parseInt("ABC")  // 返回NaN,NaN屬性是代表非數字值的特殊值。該屬性用於指示某個值不是數字。parseFloat("123.456")  // 返回123.456

　　

字串

var a = "Hello"var b = "world;var c = a + b; console.log(c);  // 得到Helloworld

　　

常用方法：

方法	說明
obj.length	返回長度
obj.trim()	移除空白
obj.trimLeft()	移除左邊的空白
obj.trimRight()	移除右邊的空白
obj.charAt(n)	返回第n個字元
obj.concat(value, ...)	拼接
obj.indexOf(substring, start)	子序列位置
obj.substring(from, to)	根據索引擷取子序列
obj.slice(start, end)	切片
obj.toLowerCase()	小寫
obj.toUpperCase()	大寫
obj.split(delimiter, limit)	分割

 

拼接字串一般使用“+”

布爾類型

區別於Python，true和false都是小寫。

var a = true;var b = false;

　　

數組

類似於Python中的列表。

var a = [123, "ABC"];console.log(a[1]);  // 輸出"ABC"

　　

　　

 常用方法：

方法	說明
obj.length	數組的大小
obj.push(ele)	尾部追加元素
obj.pop()	擷取尾部的元素
obj.unshift(ele)	頭部插入元素
obj.shift()	頭部移除元素
obj.slice()	切片
obj.reverse()	反轉
obj.join(seq)	將數組元素串連成字串
obj.concat(val, ...)	串連數組
obj.sort()	排序

遍曆數組中的元素：

var a = [10, 20, 30, 40];for (var i=0;i<a.length;i++) {  console.log(i);}

　　

　　

對象

類似於（某方面類似）Python中的字典資料類型

var a = {"name": "貝貝", "age": 18};console.log(a.name);console.log(a["age"]);

　　

　　

遍曆對象中的內容：

var a = {"name": "Alex", "age": 18};for (var i in a){  console.log(i, a[i]);}

　　

　　

null和undefined

• undefined表示的是當聲明的變數未初始化時，該變數的預設值是undefined。還有就是函數無明確的傳回值時，返回的也是undefined。
• null表示值不存在

undefined表示聲明了變數，但是還沒有賦值。null聲明了變數並且變數是空值。

類型查詢

typeof "abc"  // "string"typeof null  // "object"typeof true  // "boolean"typeof 123 // "number"

　　

　　

typeof是一個一元運算子（就像++，--，！，- 等一元運算子），不是一個函數，也不是一個語句。

運算子算數運算子

+ - * / % ++ --

 

比較子

> >= < <= != == === !==

注意：

1 == "1"  // true1 === "1"  // false

 

邏輯運算子

&& || !

 

賦值運算子

= += -= *= /=

流程式控制制if-else

var a = 10;if (a > 5){  console.log("yes");}else {  console.log("no");}

　　

if-else if-else 

var a = 10;if (a > 5){  console.log("a > 5");}else if (a < 5) {  console.log("a < 5");}else {  console.log("a = 5");}

　　

switch

var day = new Date().getDay();switch (day) {  case 0:  console.log("Sunday");  break;  case 1:  console.log("Monday");  break;default:  console.log("...")}

　　

for

 

前端基礎之JavaScript