2013年12月19日 星期四

在JSFIDDLE上使用console.log

相信前端工程師應該都對JSFIDDLE不陌生
用來測試程式碼是個很好用的工具
但在JSFIDDLE中沒有內建console.log的輸出
對測試程式碼來說有時候還是有點不方便


於是
我們自己來寫一個吧,短短幾行程式碼就好了
以前曾經看過有人提過的idea
最近突然想到就馬上來寫

HTML block加入:
<div id="console"></div>

JavaScript block加入(必須加在使用console.log之前):
var console = {};
console.log = function(output){
    $('#console').append(output+'<br/>');
};


之後就可以用console.log('What I want to output');的方式來寫
就跟平常一樣
Example: http://jsfiddle.net/7T9f3/1/

have fun

2013年12月12日 星期四

Backbone.js 學習(一) 基本概念

簡介

    開門見山地說,Backbone.js 是一個讓使用者可以使用MV*架構撰寫前端程式的framework。在Backbone.js(以下簡稱Backbone)之中,有Model、有View,但是沒有字面上的Contorller,一般我們認知的Controller在Backbone中使用View及Router來達成任務。以下列出Backbone中所擁有的模組,讓我們一窺Backbone的神奇內在。

  • Model
  • Collection
  • View
  • Router
  • History
  • Sync
  • Event

大觀念

在Backbone之中會包含jQuery以及Underscore.js來組合Backbone所提供的功能,Backbone預設採用RESTFUL的方式來與後端溝通。也就是除了原本的POST、GET之外,再加上了UPDATE、DELETE的method。在預設情況下,你需要在後端撰寫RESTFUL的程式碼,來橋接來自前端的資料;但是你也可以透過改寫Backbone.Sync來達到你想要的橋接方式,也可以使用Web的localStorage來當作後端橋接,橋接的改寫十分彈性,相信你一定會。

2013年8月27日 星期二

資料庫正規化基本概念

在資料庫的設計當中,有所謂的正規化(Normal Form)
正規化的出現,是為了消除不一致性,以及新增、修改、刪除上面的問題

正規化中比較常用的是:
  1.   第一正規化(1NF)
  2.   第二正規化(2NF)
  3.   第三正規化(3NF)
  4.   Boyce-Codd正規化(BCNF)

2013年8月22日 星期四

使用雙驚嘆號 !! 的寫程式技巧

之前瀏覽HTML5 Rocks的時候 看到一段Code如下:
function hasGetUserMedia() {
  // Note: Opera is unprefixed.
  return !!(navigator.getUserMedia || navigator.webkitGetUserMedia ||
            navigator.mozGetUserMedia || navigator.msGetUserMedia);
}
轉貼自 http://www.html5rocks.com/en/tutorials/getusermedia/intro/

其中的return 使用了兩個驚嘆號(!!) 這是什麼意思呢?

2013年8月17日 星期六