SimonAllen

SimonAllen

Day15 函式就是物件

今天來看看函式Functions 在JS這個物件導向語言裡,其函式的特性被稱為一級函式。 一級函式First Class Functions 開發者對別的基礎型別做的事,也可以對函式去做,因為函式就是物件,而物件就是名稱/值的組合。 開發者可以指派函式給變數,將函式傳入另一個函式,也可以用實體語法建立函數。 函式可以有屬性和方法,因為他就是物件,所以它可以連結到物件、屬性、其他函式(Methood) 關於一級函式的介紹,可以參考: 維基百科頭等函式 ITome專欄物件導向語言中的一級函式 by林信良 而JS的函式還有隱藏的物件屬性,其中最重要的有兩個: NAME 即名子屬性,然而名子不是必須的,函式也可以沒有名子(匿名函式) CODE 即程式屬性code property,這個屬性的內容,就是開發者在編輯器上開發時,寫在函式內的程式碼。 我們寫的程式碼會成為這個屬性的值,而CODE屬性的特性是,它的內容是可以呼叫執行的。 來看看以下程式碼 function sport(){ console.log('運動'
SimonAllen

Day14 JSON 與物件實體

今天來看看JSON 前端工程師在串接資料,常常是接後端發出的JSON檔案(API),再將其內容渲染到網頁上,那什麼是JSON呢? JSON,全名JavaScript Object Notation 是受到JavaScript物件實體語法啟發的傳輸格式,比起使用XML傳輸資料,JSON格式在檔案大小上更為輕量,也是現在主流的傳輸格式。 一個JavaScript物件可以長這樣 {name: 'Simon',isF2E: true} 而JSON會是這樣 {'name':'Simon','isF2E':'true'} 看起來好像差不多? 物件的屬性名name,在JSON中被引號包起來變成'name',也就是說原本的屬性名到了JSON變成字串,JavaScript利用物件實體語法時,物件屬性名稱也可以是字串(對物件實體語法,屬性的引號'或"可加可不加) var
SimonAllen

Day13 物件與物件實體

今天我們來看物件實體語法object literals JS可以透過new Object()來建立物件,但開發時相對少見這種寫法。 這是因為JS還有另一種更快建立物件的方法,就是物件實體語法object literals。 什麼是物件實體語法呢? 來看看以下程式碼: var Batman = {}; 用一對大括號{}快速建立物件,大家最常用的就是這種寫法(我也是)。 這種寫法的好處在於可以同時建立屬性和方法: var Batman = { firstname: 'Bruce', lastname: 'Wayne' }; 使用物件實體語法和這種寫法 var Batman = new Object(); Batman['firstname'] = 'Bruce'; Batman['lastname'] = 'Wayne'; 兩者其實是一樣的 物件實體語法的好處在於可以快速、直觀的建立物件、
SimonAllen

Day12 物件與點

今天開始進入第四章節,物件與函式的部分囉。 第二天的筆記有提到,物件是一群名稱/值的組合 例如: { rice: '米飯', soup: '海鮮濃湯' } 而其值可以是另一個名稱/值的組合,也可以是數值、字串、布林、物件、函式....等等。 例如: { rice: '米飯', soup: { seafood: '蝦子', hot: true, cook: function(){ console.log('海鮮濃湯'); } } } 關於物件還有幾件事: * 物件可以有個原始的設定,又稱屬性Properties。 * 物件可以連結至另一個物件(物件裡包含著物件),這個被連結的物件也是屬性。 * 物件裡可以有函式,當函式在物件裡,稱為方法Methods,
SimonAllen

Day11 設定函式內的預設值

今天筆記是昨天內容的衍生 開發者用JS程式呼叫函式時,傳參數進去處理是很常見的方式,如果呼叫時沒有帶入參數,會發生什麼事呢? 來看看以下程式碼: function greet(name){ console.log('Hello ' + name); } greet() 結果是: 發生了什麼事? 我們沒有帶值進去,JS在呼叫函式時也沒報錯,因為傳入的值在呼叫階段被設定進記憶體,但我們什麼都沒有傳,所以JS把這個空的東西,在記憶體被設定成undefined並傳入。 當undefined與字串相加時被轉型成字串'undefined',自然印出'Hello undefined'囉! 但是這並不符合開發者預期的狀況,有沒有辦法讓我們呼叫函式,在未帶入值的時後,函式內有個預設值存在嗎? 這個時候可以使用昨天筆記的方法。 function greet(name){ name = name || '<Your name here>
SimonAllen

Day10 存在與布林

今天來看存在existence與布林boolean的關係 由於JS常發生型別轉換這件事,開發者可以用Boolean()這個內件函式,來判斷型別轉為boolean的結果。 undefined、null、""這些代表沒有的值,都會被被型轉成false。 開發者可以利用此特性,用if()敘述來判斷是否成功取值。 例如: var a; if(a){ console.log('這裡有東西'); } 結果什麼也沒發生,也沒有語法錯誤,發生了什麼事? 我們都知道宣告變數,變數預設值是undefined。 而if()敘述句()內看的是布林值true或false,來決定敘述句{}裏頭的程式碼要不要執行。 故a在if()敘述句被型轉為false,所以這個條件判斷內的程式碼不執行。 如果是有值的狀況,例如: var a = 'IT鐵人賽'; if(a){ console.log('這裡有東西&
SimonAllen

Day09 強制型轉與比較運算子

今天我們來看看強制型轉與比較運算子 JavaScript是動態型別Dynamic Typing語言,故非常容易發生強制型轉這件事。 強制型轉Coercion,JavaScript自動轉換值的型別。 例如說: var a = 1 + 2; console.log(a) 結果是3,合理! 那這樣呢? var a = 1 + '2'; console.log(a) 發生了什麼事? 這裡我們可以用typeof()這個內建函式來查看一下a現在的型別 string(字串) 對JS而言,當數值與字串相加時,它會將數值自動轉型為字串,所以1變成'1'。 實際執行可以想像變成: var a = '1' + '2'; 字串'1&