Javascript新手集中營

時間 2019-11-16

原文原文鏈接

javascript是世界上最流行的編程語言，也許沒有之一，看看github，stackoverflow上面的開源項目和問答就可略知一二。它能夠用來開發web app、服務器、或者聯合native開發hybird app，等等。或許你感受不到它的存在，但實際上javascript已經無處不在了！！

在學習javascript以前，咱們須要一個開發環境，以便作一些簡單的練習，熟話說，工欲善其事，必先利其器。

瀏覽器，推薦chrome
文本編輯器，推薦sublime text2

你沒看錯，就是這麼簡單，一個文本編輯器、一個瀏覽器足以。

javascript是一種解釋性的腳本語言，不一樣於java，C，C++必須通過編譯才能運行，javascript由javascript引擎（如chrome的V8引擎）解釋執行，不須要編譯的過程，因此相對於編譯型的語言運行速度相對慢一點。

廢話很少說，看一個例子：

<!DOCTYPE HTML>
<html>
<head>
    <meta charset="UTF-8">
    <title>Getting started！</title>
    <script>
     　　alert('hello world！');
    </script>
</head>
<body>
</body>
</html>

新建一個文本文件，粘貼上面這段文本，保存爲begin.html，而後用瀏覽器打開，咱們就獲得了一個javascript版的hello world！以下圖，是否是很簡單？javascript

這是第一個例子，什麼都沒作，不過它說明了如何讓javascript運行起來：

　　首先，咱們須要一個運行javascript的宿主環境，也就是這個html文件，以便讓瀏覽器知道如何解析，並執行裏面的腳本。

　　而後，咱們須要將javascript代碼放到script標籤中，告訴瀏覽器這裏面的是javascript代碼，須要用javascript引擎解釋執行。

到這裏你應該略微知道如何執行一段javascript代碼了，接下來咱們瞭解下javascript的基本概念。

javascript基本概念：

1. 語法

　　區分大小寫

　　標識符：第一個字符必須是字母、_或$。其餘字符能夠是字母、_、$、或數字。
註釋：同C、java同樣。

　　　　　　//用於單行註釋

　　　　　　* 多行註釋

　　語句：由分號結尾，能夠省略。

2. 關鍵字

　　　　　　if else do while for in

　　　　　　break continue

　　　　　　switch case default

　　　　　　try catch fianlly throw

　　　　　　instanceof typeof

　　　　　　function return this

　　　　　 void

　　　　　　var

　　　　　　delete

　　　　　　new

　　　　　　with

3. 保留字

　　　　　　class implements public protected private package super import abstract export interface static extends

　　　　　　int double float const short char byte enum boolean long

　　　　　　final native synchronized transient

　　　　　　throws

　　　　　　goto

　　　　　　debugger

　　　　　　volatile

　　　　　　let yield

4. 變量

　　　　　　javascript的變量是弱類型的，定義方式以下：

　　　　　　　　var name;

　　　　　這樣就定義了一個名爲name的變量，咱們用var聲明一個變量，而不像C、Java使用如int age = 22;這樣的方式定義變量。所謂弱類型的意思就是定義了一個變量，而沒有顯示的說明這個變量的什麼類型的，因此咱們能夠用這個變量存儲任何類型的數據！是否是很酷？

　　　　　　上面定義了變量name，但並無給它賦值，實際上name是一個特殊的值----undefined，這時它尚未任何意義。

　　　　　　　　name = "javascript";

　　　　　　這條語句給變量name賦值爲字符串"javascript"，固然也能夠這樣：

　　　　　　　　name = 1000;　　//這時的name就是整數1000了，雖然變量name的值聽起來不該該是1000，但誰讓它是弱類型呢！

　　　　　　固然，定義變量的時候賦值看起來更合適：

　　　　　　　　var name = "javascript";

5. 數據類型html

　　弱類型不等於沒有數據類型，計算機固然要知道當前處理的數據是什麼類型的，不然不知道應用哪一種運算啦！

　　　　　　javascript有5種基本數據類型：

　　　　　　　　String、Number、Boolean、Null、Undefined

　　　　　　和一種複雜數據類型：

　　　　　　　　Object　　（其實它一點都不復雜，就是一些無序的key和value的集合而已）

　　　　　　就這六種數據類型，沒了，是否是很驚訝？和C、Java的數據類型比較下：

　　　　　　　　java中有byte、short、int、long、float、double，頭大沒？只是數而已，要這麼多類型？

　　　　　　　　javascript固然不須要，只有一個Number！！

　　1. Undefined　

　　　　　　　　前面有提到var name;此時name的值是undefined，有印象沒？

　　　　　　　　Undefined類型只有一個值，就是undefined。

　　　　　　　　　　var name;

　　　　　　　　　　alert(name == undefined); //ture

　　　　　　　　當咱們聲明瞭一個變量，但沒有初始化時，它就是undefined。實際上和下面的表達式是等價的：

　　　　　　　　　　var name;

　　　　　　　　　　　　和

　　　　　　　　　　var name = undefined;

　　　　　　　　　　　　等價

　　2. Null

　　　　　　　　和Undefined同樣，Null也只有一個值---null。null表示一個空對象指針。因此若是要用一個變量存儲一個Object，那麼最好給它初始化爲null，當使用它時判斷值是否等於null，就知道這個變量是否被賦值一個真正的對象了。

　　　　　　　　　　var animal = null;

　　　　　　　　　　　　....

　　　　　　　　　　animal = dog;　　//dog是一隻真正的狗

　　　　　　　　　　if(animal != null){

　　　　　　　　　　　　animal.cry();　　//判斷animal是否保存了一個真正的對象引用，這裏將發出狂吠，由於animal已是一隻瘋狗了！！

　　　　　　　　　　}

　　　　　　　　有沒有感受null和undefined有點像？沒錯，實際上undefined就是從null派生出來的！因此：

　　　　　　　　　　alert(null == undefined);　　//true

　　　　　　　　 總結一下：

　　　　　　　　　　雖然null和undefined有些聯繫，但用法徹底不一樣。undefined是定義變量時的默認值，因此沒有必要顯示的定義一個值爲undefined的變量，而給一個變量賦值null卻能夠明確說明這個變量即將用於保存某個對象！因此應該保持一個良好的習慣，即在定義一個Object類型的變量時，應該賦值null，以便和普通數據類型的變量進行區分。

　　3. Boolean

　　　　　　　　Boolean有兩個值：true/false。

　　　　　　　　和C不一樣，這兩個值和0、1徹底不是一回事。

　　　　　　　　　　var name = "javascript"；

　　　　　　　　　　alert(Boolean(name));　　//true　　這條語句強行轉換name爲Boolean值

　　　　　　　　各個數據類型和Boolean的關係：（隱式轉換）

　　　　　　　　　　String: 　　空字符串""轉換爲false，其餘爲true

　　　　　　　　　　Number： 0和NaN轉換爲false，其餘爲true

　　　　　　　　　　Object:　　除null外，其餘都爲true

　　　　　　　　　　Undefined：undefined將轉發爲false，注意Undefined就一個值哦！

　　4. Number　　　　　

　　　　　　　　Number是比較複雜的類型了，由於數不只有整數、小數，還分十進制、八進制、十六進制，甚至還有各類精度，如int，long等等。看下面的代碼：

　　　　　　　　　　var intNum = 100; 　　//整數

　　　　　　　　　　var floatNum = 100.55;　　//浮點數

　　　　　　　　　　var floatNum = 1.0055e2;　　//科學計數法也支持

　　　　　　　　　　var octalNum = 0123;　　//這個是以0開頭是哦，因此表示8進制數

　　　　　　　　　　var hexNum = 0xa;　　//以0x開頭，16進制數

　　　　　　　　　　 8進制和16進制數計算時也是轉換爲10進制數，因此兩個16進制數相加，結果是10進制數。

　　　　　　　　　　和java同樣，浮點數的計算也是有偏差的，因此用於判斷的表達式不能用==，如：

　　　　　　　　　　　　var a = 342.3;

　　　　　　　　　　　　var b = 972.8;

　　　　　　　　　　　　if(a + b == 1315.1){

　　　　　　　　　　　　　　//do something

　　　　　　　　　　　　}

　　　　　　　　　　千萬不要這麼作，若是非要判斷兩個浮點數是否相等，能夠用近似方法：

　　　　　　　　　　　　var a = 342.3870;

　　　　　　　　　　　　var b = 342.387;

　　　　　　　　　　　　if(a - b < 1e-10){

　　　　　　　　　　　　　　//do something

　　　　　　　　　　　　}

　　　　　　　 NaN

　　　　　　　　NaN 是Not a Number的縮寫，是一個特殊的數值。它用於表示某個指望返回Number的操做返回了非數值。如：

　　　　　　　　　　var a = 20;

　　　　　　　　　　alert(a/0);　　//NaN

　　　　　　　　這條語句在其餘語言中會致使運行時錯誤。而javascript中卻不會致使代碼中止執行。

　　　　　　　　1. 任何涉及NaN的操做都返回NaN

　　　　　　　　2. NaN不等於任何值，包括它本身

　　　　　　　　那麼如何判斷一個表達式是否是等於NaN呢？javascript爲咱們提供了isNaN函數，這個函數將試着轉換參數爲數值，若是是數值則返回false，若是是NaN，則返回true，如：

　　　　　　　　　　alert(isNaN(100));　　//false

　　　　　　　　　　alert(isNaN(NaN));　　//true

　　　　　　　　　　alert(isNaN("1234"));　　//false，字符串1234能夠轉換爲整數1234

　　　　　　　　　　alert(isNaN("name"));　　//true，這個實在轉換不了哈

　　　　　　　　　　alert(isNaN(true));　　//false，數值1

　　　　　　　　 數值轉換

　　　　　　　　　　前面你必定見過Boolean(xxx)這樣的強制轉換，同你想的同樣，Number(xxx)也有一樣的效果。

　　　　　　　　　　　　1. 若是xxx是Boolean值，則true、false分別轉成一、0。

　　　　　　　　　　　　2. 若是是null，則返回0。

　　　　　　　　　　　　3. 若是是undefined，則返回NaN。

　　　　　　　　　　　　4. 若是是字符串，則：

　　　　　　　　　　　　　　a) 字符串只是數字組成，則轉成10進制數，"123"->123，"0123"->123，前面的0會被忽略（能夠有多個0）。

　　　　　　　　　　　　　　b) 字符串是有效的浮點數，則轉成浮點數，開始的0也會被忽略。

　　　　　　　　　　　　　　c) 空字符串轉成0。

　　　　　　　　　　　　　　d) 字符串是有效的16進制格式，若是"0x123"，則轉成對應大小的十進制數。

　　　　　　　　　　　　　　e) 其餘格式的字符串，轉成NaN。

　　　　　　　　　　　　5. 若是是對象，則調用對象的valueOf方法，依照前面的規則返回數值，若是valueOf的返回值是NaN，再調用toString方法，一樣依照前面的規則轉換toString的返回值。

　　　　　　　　　　例子：

　　　　　　　　　　　　Number("Hello world")　　//這個固然返回NaN啦

　　　　　　　　　　　　Number("0003234")　　//3234，前面的多個0被忽略

　　　　　　　　　　　　Number(true)　　//1

　　　　　　　　　　　　Number("true")　　//注意是字符串哦，因此NaN了

　　　　　　　　　　　　Number("")　　//0

　　　　　　　　　　上面的轉換字符串已經很強大了，但最經常使用的確實parseInt、parseFloat函數。

　　　　　　　　　　　　parseInt("123456hello world")　　//123456，是否是很神奇，parseInt會轉換字符串前面的n多個數字，直到遇到非數字時結束。

　　　　　　　　　　　　parseInt("")　　//NaN，不一樣於Number哦！！

　　　　　　　　　　　　parseInt("0xa")　　//10，16進制數->10進制

　　　　　　　　　　　　parseInt("1234.5")　　//1234，不是四捨五入！

　　　　　　　　　　　　parseInt(1234.5)　　//1234，和上面是同樣的

　　　　　　　　　　　　parseInt(011)　　//9，八進制數->10進制

　　　　　　　　　　　　parseInt還能夠接受第二個參數，以便指定第一個參數按什麼進制轉換，如：

　　　　　　　　　　　　　　parseInt("0x11", 16)　　//17

　　　　　　　　　　　　　　parseInt("11", 16)　　//17　將"11"，按16進制轉換　

　　　　　　　　　　　　　　parseInt("a")　　//NaN　　　　　

　　　　　　　　　　　　　　parseInt("a", 16)　　//10

　　　　　　　　　　　　　　parseInt("10", 2)　　//2

　　　　　　　　　　parseFloat和pareInt相似：

　　　　　　　　　　　　parseFloat("002347hello world")　　//2347

　　　　　　　　　　　　parseFloat("002347.1234hello world")　　//2347.1234

　　　　　　　　　　　　parseFloat("0xa")　　//0，看看parseInt返回什麼？

　　　　　　　　　　　　parseFloat("1234.56.78")　　//1234.56

　　　　　　　　　　總之，這兩個方法都是從頭解析字符串，遇到一個使返回結果無效的字符爲止。

　　5. String　　　　

　　　　　　　　字符串就是由'或"表示的16位Unicode字符。如：

　　　　　　　　　　var str = "hello world";

　　　　　　　　　　　　或

　　　　　　　　　　var str = 'hello world';

　　　　　　　　同C，java同樣，字符串是不可變的，一旦建立，值就不能改變。因此只能銷燬原來的字符串，再將變量賦值一個新的字符串。

　　　　　　　　 轉義字符串：

　　　　　　　　　　String包含一些特殊的字面量，用於表示特殊用途的字符，如非打印字符

　　　　　　　　　　　　\n 　　　　　換行

　　　　　　　　　　　　\t　　　　　　製表

　　　　　　　　　　　　\b　　　　　　空格

　　　　　　　　　　　　\r 　　　　　　回車

　　　　　　　　　　　　\\　　　　　　 \

　　　　　　　　　　　　\'　　　　　 '

　　　　　　　　　　　　\"　　　　　　 "

　　　　　　　　　　　　\xnn　　　　以16進制nn表示一個字符

　　　　　　　　　　　　\unnnn　　　以16進制nnnn表示一個unicode字符

　　　　　　 類型轉換

　　　　　　　　　　1. toString()，Number、Boolean、Object、String都有toString方法。

　　　　　　　　　　　　　　var num = 10;

　　　　　　　　　　　　　　alert(num.toString())　　//'10'

　　　　　　　　　　　　toString還能夠接受一個參數，指明轉換的基數，如：

　　　　　　　　　　　　　　alert(num.toString(2))　　//'1010'，

　　　　　　　　　　　　　　alert(num.toString(16))　　//'a'

　　　　　　　　　　2. 若是是Null和Undefined，則沒有toString方法，還記得強制類型轉換麼？

　　　　　　　　　　　　　　var v = null;

　　　　　　　　　　　　　　var v1;

　　　　　　　　　　　　　　String(v);　　//'null'

　　　　　　　　　　　　　　String(v1);　　//'undefined'

　　　　至此除Object之外的數據類型都介紹完了。

　　6. Object

　　　　coming soon...

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。