一步步學習javascript基礎篇（1）:基本概念

一、數據類型

數據類型

基本數據類型（五種）

• Undefined
• Null
• Boolean
• Number
• String

復雜數據類型（一種）

• Object

Undefined：只有一個值undefined（定義了沒有賦值）。

例：

var str; alert(str);//undefined

注意：如果沒有用var申明，直接使用會報異常（ ... is not defined）。

建議：每次var聲明都賦初始值，可以減少很多意外情況。

如：

var str; var str2="張三"; str = str + str2; alert(str);//並不是我們意料中的“張三”

Null:略

Boolean：只有兩個字面值： true 和 false。
任何數據類型通過Boolean（）函數都可以轉成Boolean類型。

• String：非空字符=>true     空字符=>false
• Number：任何非零=>true   0和NaN=>false
• Object:任何對象=>true      null=>false
• Undefined                        undefined=>false

如：

var str = Boolean(NaN); var str2 = Boolean("張三"); var str3 = Boolean(undefined); alert(str+" "+str2+" "+str3);

既然如此，我們在使用if語句的時候會自動執行相應的 Boolean 轉換。

if (str) {
    //str只要是非空字符、任何非零數字、任何非null對象 都是true
    //str只要是空字符、0、NaN、null、undefined 都是false
    //這樣就省去了 我們一個個的判斷了
    alert("true");
}

 String：略

二、操作符 

遞增和遞減操作符：

【++num、--num、num++、num--】

var age = 3, age2 = 3; age++; ++age2; alert(age+" "+age2);

都是4，好像看不出有什么不同。

var age = 3, age2 = 3,num1 ,num2; num1 = age++ + 1; num2 = ++age2 + 1; alert(num1+" "+num2);

 好，區別來了。一個任然是4，一個變成了5。為什么會這樣呢？優先級不同而已，age++先執行運算符+然后在自身加1，++age先自身加1然后再通過+運算符加1。

位操作符：

【按位非NOT(~)、按位與AND(&)、按位或OR(|)、按位異或XOR(^)、左移(<<)、有符號的右移(>>)、無符號右移(>>>)】
其實平時我們很少用到，這里稍作了解。

例：按位非

var num1 = 25; // 二進制 00000000000000000000000000011001
var num2 = ~num1; // 二進制 11111111111111111111111111100110
alert(num2); // -26 

例：按位與

var result = 25 & 3;
alert(result); //1
//*********************
25 = 0000 0000 0000 0000 0000 0000 0001 1001
3 =  0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
AND = 0000 0000 0000 0000 0000 0000 0000 0001 

例：按位異或

var result = 25 ^ 3;
alert(result); //26
//*************
25 = 0000 0000 0000 0000 0000 0000 0001 1001
3 =  0000 0000 0000 0000 0000 0000 0000 0011
---------------------------------------------
XOR = 0000 0000 0000 0000 0000 0000 0001 1010 //十進制值 26
 

例：左移

var oldValue = 2; // 等於二進制的 10
var newValue = oldValue << 5; // 等於二進制的 1000000，十進制的 64

例：有符號右移

var oldValue = 64; // 等於二進制的 1000000
var newValue = oldValue >> 5; // 等於二進制的 10 ，即十進制的 2 

例：無符號右移（這個差異有點大，因為第32為1代表負數的值也移過來了）

var oldValue = -64; // 等於二進制的 11111111111111111111111111000000
var newValue = oldValue >>> 5; // 00000111111111111111111111111110 等於十進制的 134217726

 

布爾操作符：

【邏輯非(!)、邏輯與（&&）、邏輯或（||）】

這里需要說的就是&&和||是短路操作。||如果前面一個滿足條件了就不檢測后面的條件了，&&相反前面一個不滿足條件就不檢測后面的條件了。
例：

var age = 3;
if(age||aaa){//這里的age轉Boolean為ture，所以后面的aaa就不檢測了。
alert(age);}
if(aaa||age){//這里將會報錯
alert(age);}

測試：

var age = 3; if(age||aaa){//這里的age轉Boolean為ture，所以后面的aaa就不檢測了。 alert(age);} if(aaa||age){//這里將會報錯 alert(age);}

這里可以告訴大家一個小小的技巧，很多時候我們並不知道某個變量是否有值，但是我們又需要正常使用，那么我們可以給個備胎。

如：瀏覽器的兼容問題，在舊式瀏覽器中是用window.event來取事件的相關屬性值，新式瀏覽器中是直接通過形參的形式傳過來的。我們就可以。

function myonclick(ev) {
    var myevent = ev || window.event;//這樣就可以保證新舊瀏覽器的兼容了
}

實驗:　　

var obj = null; var obj2 = obj||"備胎"; alert(obj2);

加性操作符：

【加法（+）、減法（-）】
這個再熟悉不過了，不過還是有一點需要注意。

var strnum1 = "5";
var num2 = strnum1 + 3;
var num3 = strnum1 - 3;
alert("num2="+num2+" num3="+num3);//這里會是什么結果呢？

讓我們來測試一下吧。

var strnum1 = "5"; var num2 = strnum1 + 3; var num3 = strnum1 - 3; alert("num2="+num2+" num3="+num3);//這里會是什么結果呢？

為什么會這樣？字符串和數字相加，數字會轉為字符串。字符串和數字相減，字符串轉為數字。

相等操作符

var num1 = "5"; var num2 = 5; var isEqual = num1==num2; alert("num1是否等於num2："+ isEqual);

奇怪吧，字符串怎么和數字相等。是的，這里用到了自動轉型。但是，我們不想看到這樣的結果怎么辦？

var num1 = "5"; var num2 = 5; var isEqual = num1===num2; alert("num1是否等於num2："+ isEqual);

是的，我們可以用===全等於。不僅比較數值，還比較類型。

三、語句

for-in語句

for循環語句用得多，for-in可能平時就用的較少了。（for-in循環應該用在非數組對象的遍歷上，使用for-in進行循環也被稱為“枚舉”。）

例：

var obj = {id:2,name:"張三"}; var str = ""; for(o in obj) { str += "屬性："+ o + " 值：" + obj[o] + " "; } alert(str);

label語句

感覺和C#中的goto很像，但又不一樣。

我們平時有沒有過在多個循環嵌套里面想跳出第二層循環？一般我們只能用break或者continue跳出最里面的循環，或者return跳出整個函數。萬萬沒想到的是，還有一個label語句，可以跳出任意層循環。
例：

var num = 0; outermost: for (var i=0; i < 10; i++) { for (var j=0; j < 10; j++) { if (i == 5 && j == 5) { break outermost; } num++; } } alert(num); //55

 好了，第一篇差不多就整理到這里了。最后出幾個有趣的題目給大家。

一、為什么 1＝0.9999999999…… 
二、為什么 alert(0.1 + 0.2)//0.30000000000000004
三、為什么 alert(0123 + 4)//87
四、
var obj1 = {}; obj1.name2 = "張三";
var str1 = "test"; str1.name2 = "李四";
alert(obj1.name2 + " " + str1.name2);
//彈出值是什么
五、
var obj1 = { name2: "111" };
var obj2 = obj1;
obj1.name2 = "222";
alert(obj2.name2);//這里彈出什么？
obj1 = { name2: "333" };
alert(obj2.name2);//這里彈出什么？
六、
 var fun = function (num1) {
     if (num1 <= 1) {
         return 1;
     }
     else {
         return num1 * fun(num1 - 1);
     }
 }
 var fun2 = fun;
 fun = function () {
     return 1;
 }
 alert(fun2(5));//這里彈出什么？ 

有興趣的同學可以思考或者翻閱資料。

 

這是學習記錄，不是教程。文中錯誤難免，您可以指出錯誤，但請不要言辭刻薄。

原文鏈接：http://haojima.net/zhaopei/511.html

本文已同步至目錄索引：一步步學習javascript

歡迎上海“程序猿/媛”、"攻城獅"入群：【滬猿】229082941 入群須知