The Will Will Web | All posts tagged 'avaScript'

The Will Will Web

記載著 Will 在網路世界的學習心得與技術分享

前端工程研究:理解函式編程核心概念與如何進行 JavaScript 函式編程

函式編程 ( functional programming ) 在這幾年變得有點熱門,像是 React 這套 JavaScript 框架,如果想學好他,通常也都必須要先熟悉函式編程的開發方法才行。畢竟函式編程只是一種程式設計方法,只要程式語言本身可以符合函式編程的基本概念,就可以宣稱用函式編程來開發程式。今天這篇文章,就想以 JavaScript 程式語言為出發,帶大家理解 JavaScript 函式編程的魅力與重要的核心概念。

... 繼續閱讀 ...

前端工程研究:關於 JavaScript 中 Date 型別的常見地雷與建議作法

今天這篇文章,我想來談談 JavaScript 到底如何實作「日期字串」格式解析,日期時間有太多種表達方式,一般人在剛接觸日期格式的時候,都不會想太多跨瀏覽器的問題,通常都是遇到問題的時才來靠北瀏覽器有多爛多爛。有趣的是,有時候還會怪錯對象,例如 XXXX 框架好爛,我寫 JS 這麼久都沒遇過這問題,用了 XXXX 框架才遇到的。現在,我們就開始來對這個說常用不常用,用到時不熟悉的「日期」型別,話說從頭。

... 繼續閱讀 ...

我要成為前端工程師!給 JavaScript 新手的建議與學習資源整理

今年有越來越多企業開始跟我們接洽企業內訓的事,想請我幫他們培訓前端工程師,但你知道一個好的前端工程師絕對不是兩三個月可以養成的,需要多年的努力與磨練才會有點成績。而這幾年可謂前端正夯,有為數不少的人開始大規模的往前端開發移動,而我被問到最多的問題就是「請問 JavaScript 要怎麼學?」或「請問 JavaScript 該怎樣入門?」諸如此類的問題。大家都知道,對於一門程式技術來說,「會寫」與「會教」是兩個截然不同的領域,會寫 JavaScript 的人到處都是,但是會教的人就相對少很多了。我這幾年教授 JavaScript 開發實戰課程已經超過 15 梯次,在將近 500 位學員裡面���我所看到的大部分學員都是對 JavaScript 不勝理解,普遍處於一種一知半解、模糊不清的狀態。另一方面,我在公司內部也帶過不少工程師,總是有人會想學習 JavaScript 但不知道如何入門的情況,這讓我陷入深思,該如何幫助一個人學習 JavaScript 從入門到精通呢?本篇文章將說說我個人的一些想法與建議。

... 繼續閱讀 ...

前端工程研究:關於 JavaScript 中物件的 valueOf 方法

在 JavaScript 程式語言裡,這個 valueOf() 函式算是非常少用的一個內建函式,甚至於很多人連聽都沒聽過。然而,這個 valueOf() 函式十分重要,我在研究之後發現,理解了 valueOf() 的用途後,不但更能理解 JavaScript 如何針對物件進行數值布林字串運算,更能夠利用 valueOf() 解決 使用者定義物件 無法比對大小的問題。

... 繼續閱讀 ...

介紹好用工具:JS Bin ( 網站前端工程師的學習利器 )

我好像很久沒有介紹好用工具了,並不是我偷懶不玩工具,而是最近介紹工具的資訊大多分享在 Will 保哥的技術交流中心 為主,不知道的人記得過去按「」喔。今天這篇文章,主要介紹 JS Bin 這套好用的網頁前端工具,我覺得 JS Bin 介面非常簡潔,非常對我的胃口,雖然此工具還在不斷發展,但是目前的品質已經非常好了,因此覺得可以發表一篇文章來介紹這套工具,並分享一些不容易發現的使用技巧!

... 繼續閱讀 ...

介紹好用工具:Compat Inspector ( 驗證網頁在 IE 的相容性 )

我在前天 2012 微軟開發者大會 (2012 Microsoft Developer Day) 演講的主題是 HTML5 開發技術於 WIN8 及 IE10 上的應用,為此演講我準備了不少內容,總覺準備的剛剛好,而且覺得少講一點都不行,前一天在公司內部排練 (Rehearsal) 時講了 90 分鐘左右才講完,但此次演講只有 50 分鐘而已,因此必須刪除部分內容才能準時講完,而刪除的內容就是很棒的 Compat Inspector 工具,因為我覺得這工具寫成文章比現場演說來的容易學習,就來看看這個神奇的工具如何檢測你的現有網站吧。

... 繼續閱讀 ...

Visual Studio 11 新功能介紹:CSS 與 JavaScript 編輯器

之前在 Visual Studio 2010 中要編寫 CSS 或 JavaScript 不是很方便,充其量只能說是個「文字編輯器」而已,不能被稱為「開發工具」,但這些編輯器在 Visual Studio 11 已經大幅進化,眾多的貼心功能不得不大聲叫好,尤其是 CSS 編輯器改進的幅度最大,就讓我們來看看有哪些增進的好用功能吧。

... 繼續閱讀 ...

jQuery 取得表單資料、單選 Radio 與多選 Checkbox 的方法

透過 jQuery 取得 HTML 表單資料其實不難,但每次遇到要取得 Radio 單選選項的選取值與 Checkbox 多選的選取值都要花些時間查詢取值的方法,網路上能搜尋到的方法也大多是舊版 jQuery 的語法已經不適用了,因此特別撰文筆記一下,也順便把取得各式 HTML 表單欄位的方法做個整理。

... 繼續閱讀 ...

善用 JavaScript 的 debugger 指令讓網頁主動進入中斷點

在我們日常開發的工作裡經常會使用 Visual Studio 對 ASP.NET 進行偵錯,不過都是針對在伺服器端的程式進行偵錯,如果要對前端 (Browser) 的 JavaScript 進行偵錯,就可以利用今天打算介紹的這個開發技巧讓已經開啟指令碼偵錯工具的網頁直接進入中斷點,或是強迫網頁啟動偵錯工具利用 Visual Studio 來對網頁進行偵錯,如此一來就能夠輕易的在前端快樂的遊走每一行 JavaScript 程式碼。

... 繼續閱讀 ...

介紹好用工具:jsFiddle - Online Editor for the Web

今天介紹這工具可說是在 Web 界非常實用的線上編輯器,編輯什麼呢?就是 HTML, CSS, JavaScript 這些東西啦。以往為了要展示或分享一些 JavaScript 的功能或 CSS 樣式,必須要架設一個網站放這些檔案才能讓其他人知道這東西執行後的結果,但 jsFiddle 的出現可謂是佛心來的,幫我們「代管」這個程式碼在「雲」上,讓我們可以將任意網頁內容放上去測試、驗證、存檔、分享。

... 繼續閱讀 ...

如何在 node.js 執行 UglifyJS 對 JavaScript 進行壓縮或美化

前一篇文章我介紹了如何在 Cygwin 環境下安裝 node.js,我的原始目的只是為了要能正常執行 UglifyJS 而已,原本想說在 node.js 寫的程式都是 JavaScript 應該不會有什麼問題吧,結果是目前版本的 UglifyJS 還有點小問題導致無法正常執行,解決方式也很簡單,以下是 UglifyJS 的安裝與使用說明。

... 繼續閱讀 ...

如何在 Windows 作業系統安裝 Node.js 執行環境 (Cygwin)

由於 jQuery 1.5 在前幾天釋出正式版,我從 Release Notes 中發現 jQuery Team 這次改用 UglifyJS 對整個 jQuery 原始碼進行編譯 (其實是將 JS 最小化)(原本是使用 Google Closure Compiler ),但 UglifyJS 只能執行在 NodeJS 執行環境下,原本 NodeJS 只能跑在 Linux 環境下,還好從  node.js v0.2 版之後就開始支援在 Windows 環境下執行,以下是設立 NodeJS 執行環境的流程。

... 繼續閱讀 ...

使用 Regular Expression 驗證密碼:使用 JavaScript 的陷阱

我在前年有寫過一篇【 使用 Regular Expression 驗證密碼複雜度 】文章,當時撰寫的技巧完全是針對 .NET 提供的 Regular Expression 而寫,雖然我的文章在標籤的地方有特別提到 .NET,但還是有人將文章裡提供的 Regular Expression 直接抄去給 JavaScript 使用,結果當然是養出一堆莫名其妙的臭蟲(Bug)。

... 繼續閱讀 ...