javaScript基礎語法（上）

阿新 • • 發佈：2019-01-13

相關理論概念：

直接量的概念：直接描述某個（些）儲存空間的值的量，如變數的值、物件的值、陣列的值。

資料型別：在資料結構中的定義是一個值的集合以及定義在這個值集上的一組操作。

1、變數的宣告和使用

　　變數：是計算機語言中能儲存計算結果或能表示值抽象概念。變數可以通過變數名訪問。

　　語法規則：

　　　　var 變數名；

　　然後進行賦值：num=10時直接賦值：

　　var num=10;

　　良好的變數命名方式：

變數必須以字母開頭；
變數名稱對大小寫敏感（y 和 Y 是不同的變數）；
變數名應當總是遵守駝峰大小寫命名法，並且命名字首應當是名詞。

　　程式碼示例：

　　　　//好的寫法：

　　　　var count = 10;

　　　　var myName = "Nicholas";

　　　　var found = true;

　　　　//不好的寫法：

　　　　var getCount = 10;

　　　　var isFound = true;

2、資料型別

資料型別	含義
undefined	未定義
null	空
string	字串型別
boolean	布林型別
number	數值型別

注意：

居然undefined和null的含義不同，但undefined實際上是由null派生來的，ECMAScript把它們定義為相等的。

number型別既可以表示32位整數，還可以表示64位浮點數。
is not defined與undefined的區別：is not defined是未宣告定義，找不到。undefined是已定義在目錄檔案中未找到。

一、基礎資料型別：

　　1、undefined：

　　　　undefined是一個特殊值，那些沒被變數初始化的變數都有一個初始值，即undefined，表示這個變數等待被賦值。

　　　　程式碼示例：

　　　　//不好的寫法

　　　　var person;

　　　　console.log(person===undefined); //true

　　　　//foo未被宣告

　　　　var person;

　　　　console.log(typeof person); //"undefined"

　　　　console.log(typeof foo);//"undefined"

　　　　//好的寫法，建議使用null

　　　　var person =null;

　　　　console.log(person=== null);

　　2、null

　　null是一個特殊值，但我們常常誤解它，將它和undefined搞混。在以下場景中應當使用null.

用來初始化一個變數，這個變數可能賦值為一個物件。
用來和一個已經初始化的變數比較，這個變數可以是也可以不是一個物件。
當函式的引數期望是物件時，用作引數傳入。
當函式的返回值期望是物件時，用作返回值傳出

　　還有以下兩個場景不應當使用null.

不要使用null來檢測是否傳入了某個引數。
不要使用null來檢測一個未初始化的變數

　　程式碼示例：

　　//好的用法

　　var person = null;

　　//好的用法

　　function getperson () {

　　　　if (condition){

　　　　　　return new person ("Nicholas");

　　　　} else {

　　　　　　return null;

　　　　}

　　//好的用法

　　var person = getPerson ();

　　if(person != null ){

　　　　dosomething();

　　}

　　//不好的寫法：用來和未初始化的變數比較

　　var person;

　　if (person !=null){

　　　　dosomething();

　　}

　　//不好的寫法：檢測是否傳入了引數

　　function dosomething (arg1,arg2,arg3,arg4) {

　　　　if ( arg4 != null){

　　　　　　dosomethingElse();

　　　　}

　注意：最好把null理解為佔位符（placeholder）。

　　檢測屬性避免非空比較：

另外一種用到null(以及undefined)的場景是當檢測一個屬性是否在物件中存在時，比如：

　　//不好的寫法：檢測假值

　　if ( object[propertyName]) {

　　　　//一些程式碼

　　}

　　//不好的寫法：和null相比較

　　if( object[propertyName] != null){

　　　　//一些程式碼

　　}　　

　　//不好的寫法：和undefined比較

　　if (object[propertyName]){

　　　　//一些程式碼

}

　　注意：建議使用in運算子進行判斷屬性。

　　如果例項物件的屬性存在、或者繼承自物件的原型，in運算子都會返回true.比如：

　　var object = {

　　　　count:0;

　　　　related: null;

　　};

　　//好的寫法

　　if( "count" in object){

　　　　//這裡的程式碼會執行

　　}

　　//不好的寫法：檢測假值

　　if ( object["count"]){

　　　　//這裡的程式碼不會執行

　　}

　　//好的寫法

　　if ( "related" in object) {

　　　　//這裡的程式碼會執行

　　}

　　//不好的寫法：檢測是否為 null

　　if ( object["related"] !=null ){

　　　　//這裡的程式碼不會執行

　　}

　　//對於所有非dom物件來說，這是好寫法

　　if (object.hasOwnProperty("related")){

　　　　//執行這裡的程式碼

　　}

　　//如果你不確定是否為dom物件，則這樣寫

　　if ("hasOwnProperty" in object && object.hasOwnProperty("related")){

　　　　//執行這裡的程式碼

　　}

　　hasOwnProperty方法的使用：

如果你檢查例項物件的某個屬性是否存在，可以使用它。因為所有繼承obj的javaScript物件都有這個方法。
如果例項中存在這個屬性的返回true。注意：如果這個屬性存在於原型裡，則返回false。

　　注意：

在IE8以及更早版本的IE中，DOM物件並非繼承自object，因此也不包含hasOwnProperty方法，也就是說，你在呼叫dom物件的hasOwnProperty方法之前應當先檢測其是否存在（假如你已經知道物件不是dom，則可以省略這一步）。　
不管你什麼時候需要檢測屬性的存在性，請使用in運算子或者hasOwnProperty方法這樣可以避免很多bug。

　 3、string 字串型別

　　在javaScript中所有字元是16位的，使用的是Unicode字元編碼集。可以使用單引號或雙引號來表示，它可能包含0個或多個字元。

　　在javaScript中沒有字元型別的概念，若需要轉義字元則使用/（斜槓）+符號或相關的字母來表示。

　　javaScript中字串的編碼風格：

建議使用雙引號來表示一個字串。Crockford的程式設計規範和jquery的核心風格指南都是使用雙引號來表示。利於開發效率，上下文編碼規範統一，因為如java等語言的字串是使用雙引號來表示的。
谷歌則是使用單引號來表示。

　　相關示例：

　　//不好寫法

　　var longString ="Here's the story , of a man \ named Brady.";

　　//好的寫法

　　var longString ="Here's the story , of a man " + " named Brady.";

　 4、boolean 布林型別

布林（邏輯）只能有兩個值：true 或 false。

　　相關示例：

　　var x=true;

　　var y=false;

　 5、number型別

　　javaScript只有一個數字型別，它在內部被表示為64位的浮點數，類似於java的double浮點型別。

　　在javaScript中1和1.0的值相同，在java等語言中是不等價的，是兩種數字型別。

　　相關示例：

　　//整數

　　var count =10;

　　//小數

　　var price = 10.0;

　　var price =10.00;

　　//不推薦的小數寫法：沒有小數部分

　　var price = 10.;

　　//不推薦的小數寫法：沒有整數部分

　　var price = .1;

　　//不推薦的寫法：八進位制寫法已被棄用了

　　var num = 010;

　　//十六進位制寫法

　　var num = 0xA2;

　　//科學計數法

　　var num = 1e23;

二、引用型別

　1、陣列

　　陣列：在資料結構中編號的值是有序集合。

　　下面的程式碼建立名為 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"]; 　　陣列下標是基於零的，所以第一個專案是 [0]，第二個是 [1]，以此類推。　　相關示例：　　//不好的寫法：不贊成使用array建構函式顯式地建立陣列. 　　var colors = new Array("red","green","blue"); 　　var number = new Array (1,2,3,4); 　　//好的寫法：使用陣列初始元素來代替array建構函式來建立陣列。　　var colors = ["red","green","blue"]; 　　var numbers = [1,2,3,4];

　2、物件

物件：將一組資料與這組資料有關操作組裝在一起，形成一個實體，在資料結構中編號的值是無序集合，這個實體就是物件。包含行為和相關屬性。

　　物件由花括號分隔。在括號內部，物件的屬性以名稱和值對的形式 (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"]; 　　相關示例：　　//不好的寫法　　var book = new Object(); 　　book.title = "Maintainable JavaScript"; 　　book.author = "Nicholas C. Zakas"; 　　//好的寫法　　var book = { 　　　　title: "Maintainable JavaScript"; 　　　　author: "Nicholas C. Zakas"; 　　}

　3、函式

　　函式的作用是封裝相關資料或元件用的。

函式就是包裹在花括號中的程式碼塊，前面使用了關鍵詞 function：

　　function functionname()
　　{
　　　　//執行程式碼
　　}

　　當呼叫該函式時，會執行函式內的程式碼。

　　可以在某事件發生時直接呼叫函式（比如當用戶點選按鈕時），並且可由 JavaScript 在任何位置進行呼叫。

3、運算子

　　運算子用於執行程式程式碼運算，會針對一個以上運算元專案來進行運算。