Time of Update: 2017-01-18
因為 DOM 的存在,這使我們可以通過 JavaScript 來擷取、建立、修改、或刪除節點。NOTE:下面提供的例子中的 element
Time of Update: 2017-01-18
首先聲明:javascript中每個對象都有一個constructor屬性和一個prototype屬性。constructor指向對象的建構函式,prototype指向使用建構函式建立的對象執行個體的原型對象。function Person(){ } var person = new Person(); Person.prototype = { constructor : Person, name : 'zxs', age : 24, sayName :
Time of Update: 2017-01-18
如何向 setTimeout 、 setInterval 傳遞參數看如下代碼:var str = 'aaa'; var num = 2; function auto(num){ alert(num); } setTimeout('auto(num)',4000); 這樣寫是可以正常工作的,但是如其說這是參數傳遞,還不如說是直接使用的全域變數。所以,這種寫法是沒有必要的,一般情況下更多的是用到傳遞局部變數作為參數。把代碼修改一下://var str = 'aaa'; var num = 2;
Time of Update: 2017-01-18
事件綁定分為兩種:一種是傳統事件綁定(內聯模型,指令碼模型),一種是現代事件綁定(DOM2級模型)。現代事件綁定在傳統綁定上提供了更強大更方便的功能。一 傳統事件綁定的問題傳統事件綁定中的內聯模型不做討論,基本很少去用。先來看一下指令碼模型,指令碼模型將一個函數賦值給一個事件處理函數。傳統綁定如:window.onload=function(){ var box=document.getElementById('box'); box.onclick = function(){
Time of Update: 2017-01-18
本文約定:不特殊聲明的情況下,屬性代指屬性或方法。建立對象、對象繼承實際上是一回事:我們所需要的執行個體對象通過建構函式獲得私人屬性、通過原型鏈獲得共用的屬性。什麼是好的方式?私人屬性通過建構函式的方式獲得(不考慮執行個體中自訂私人屬性)且不需要重寫,共用屬性通過原型鏈找到且不需要重複建立。普適的方式組合使用建構函式模式和原型模式建立對象function HNU_student(name) { this.name = name; this.sayName = function() {
Time of Update: 2017-01-18
這裡簡單地講兩種方法:第一種 var mergeTo = [4,5,6], mergeFrom = [7,8,9]; mergeTo = mergeTo.concat(mergeFrom); mergeTo; // is: [4, 5, 6, 7, 8, 9] or var a = [1,2], b = [3,4], c = a.concat(b); 第二種 var mergeTo = [4,5,6],
Time of Update: 2017-01-18
工具Regexpal是一個線上JavascriptRegex處理器,地址是:http://www.regexpal.com學習正則重要的是實踐操作,不妨舉個栗子:匹配號碼:707-827-7019字元組匹配[0-9][0-9][0-9]-[0-9][0-9][0-9]-[0-9][0-9][0-9][0-9]\d匹配任意阿拉伯數字\D匹配任何非阿拉伯數字.匹配任一字元\d\d\d\D\d\d\d\D\d\d\d\d\D\d\d\d.\d\d\d.\d\d\d\d.捕獲分組與後嚮應用用圓括弧()建
Time of Update: 2017-01-18
我們都知道,進階瀏覽器可以用 JSON.parse() API 將一個 JSON 字串解析成 JSON 資料,稍微欠妥點的做法,我們可以用 eval() 函數。var str = '{"name": "hanzichi", "age": 10}';var obj = eval('(' + str + ')');console.log(obj); // Object {name: "hanzichi", age: 10}是否注意到,向 eval() 傳參時,str
Time of Update: 2017-01-18
我們先來看一個例子function foo() { console.log( this.a );}var obj = { a: 2, foo: foo};obj.foo(); // 2this指向了obj,因為foo執行時的call-site(可以理解為調用時所在範圍)在obj上面。注意是啟動並執行時候,和在哪裡聲明的沒有關係。call-site and call-stackcall-site姑且理解為調用域,call-stack為調用棧。如下代碼可以輔助我們理解function baz(
Time of Update: 2017-01-18
模板分離了資料與展現,使得展現的邏輯和效果更易維護。利用javascript的Function對象,一步步構建一個極其簡單的模板轉化引擎模板簡介模板通常是指嵌入了某種動態程式設計語言代碼的文本,資料和模板通過某種形式的結合,可以變化出不同的結果。模板通常用來定義顯示的形式,能夠使得資料展現更為豐富,而且容易維護。例如,下面是一個模板的例子:<ul> <% for(var i in items){ %> <li class='<%=
Time of Update: 2017-01-18
Backbone 為複雜Javascript應用程式提供模型(models)、集合(collections)、視圖(views)的結構。其中模型用於綁定索引值資料和自訂事件;集合附有可枚舉函數的豐富API; 視圖可以聲明事件處理函數,並通過RESTful JSON介面串連到應用程式。當我們開發含有大量Javascript的web應用程式時,首先你需要做的事情之一便是停止向DOM對象附加資料。 通過複雜多變的jQuery選擇符和回呼函數建立Javascript應用程式,包括在HTML
Time of Update: 2017-01-18
事件模型及其原理Backbone.Events就是事件實現的核心,它可以讓對象擁有事件能力var Events = Backbone.Events = { .. }對象通過listenTo偵聽其他對象,通過trigger觸發事件。可以脫離Backbone的MVC,在自訂的對象上使用事件var model = _.extend({},Backbone.Events);var view =
Time of Update: 2017-01-18
瀏覽器在處理HTML頁面渲染和JavaScript指令碼執行的時候是單一進程的,所以在當瀏覽器在渲染HTML遇到了<script>標籤會先去執列標籤內的代碼(如果是使用src屬性載入的外鏈檔案,則先下載再執行),在這個過程中,頁面渲染和互動都會被阻塞。...雖然會有阻塞,但還是有幾招可以減少JavaScript對效能的影響的。1.script標籤的位置當<script>出現在<head>中的時候,比如:<head> <script
Time of Update: 2017-01-18
集合(Set)說起集合,就想起剛進高中時,數學第一課講的就是集合。因此在學習集合這種資料結構時,倍感親切。集合的基本性質有一條: 集合中元素是不重複的。因為這種性質,所以我們選用了對象來作為集合的容器,而非數組。雖然數組也能做到所有不重複,但終究過於繁瑣,不如集合。集合的操作集合的基本操作有交集、並集、差集等。這兒我們介紹JavaScipt集合中交集、並集、差集的實現。JavaScipt中集合的實現首先,建立一個建構函式。/** * 集合的建構函式 */function Set方法 { /**
Time of Update: 2017-01-18
鏈表簡介鏈表是一種常見的資料結構,也屬於線性表,但不會按線性順序來儲存資料。而是在每一個節點中,儲存了下一個節點的指標。可以看圖理解。(有C語言基礎的可能比較好理解)。使用鏈表結構可以克服數組需要預Crowdsourced Security Testing道資料大小的缺點(C語言的數組需要預先定義長度),鏈表結構可以充分利用電腦記憶體空間,實現靈活的記憶體動態管理。接下來就是介紹兩種常見的鏈表:
Time of Update: 2017-01-18
學習起因曾經有一次在逛V2EX時,碰到這麼一個文章。數學完全還給老師了,想學回一些基礎數學,大概是高中程度的,有什麼書籍推薦?發帖的樓主大學沒有高數課程,出去工作時一直在從事前端的工作。感覺到數學知識的匱乏,所以想補一補數學。看了看文章,感覺和我很像,因為我的專業是不開高數的,我學的也是前端。也同樣感覺到了數學知識匱乏所帶來的困頓。同時因為自己的數學思維實在是不怎麼好,所以決定努力補習數學與電腦基礎知識。當時也有人說:”前端需要什麼資料結構與演算法”,但是對於這個事情我有自己的看法。我並不認為前
Time of Update: 2017-01-18
學習起因:在之前的JavaScript學習中,this,call,apply總是讓我感到迷惑,但是他們的運用又非常的廣泛。遂專門花了一天,來弄懂JavaScript的this,call,apply。中途參考的書籍也很多,以《JavaScript設計模式與開發實踐》為主,《JavaScript進階程式設計》、《你不知道的JavaScript》為輔。這三本書對我理解this,call,apply都起了很大的協助。this首先,我們先講述this。在《JavaScript設計模式與開發實踐》關於thi
Time of Update: 2017-01-18
使用Object.create實作類別式繼承下面是官網的一個例子//Shape - superclassfunction Shape() { this.x = 0; this.y = 0;}Shape.prototype.move = function(x, y) { this.x += x; this.y += y; console.info("Shape moved.");};// Rectangle - subclassfunction Rectangle() {
Time of Update: 2017-01-18
在最近的項目中,需要做到一個時間,就是使用者離開頁面的時候,我需要快取頁面面其中一部分的內容,但是我不需要使用者重新整理的時候也緩衝,我只希望在我使用者離開的時候執行這個函數。百度之,有onbeforeunload與onunload這兩個事件,但是onbeforeunload在使用者重新整理的時候也會執行。搞得我弄的挺久的,所以想在這裡做一個小小的總結onbeforeunload與onunload事件onbeforeunload定義和用法onbeforeunload
Time of Update: 2017-01-18
對於熟悉 C/C++ 或 Java 語言的工程師來說,JavaScript 顯得靈活,簡單易懂,對代碼的格式的要求也相對鬆散。很容易學習,並運用到自己的代碼中。也正因為這樣,JavaScript 的編碼規範也往往被輕視,開發過程中修修補補,最終也就演變成為後續維護人員的惡夢。軟體存在的長期價值直接與編碼的品質成比例。編碼規範能協助我們降低編程中不必要的麻煩。而 JavaScript 代碼是直接發送給客戶瀏覽器的,直接與客戶見面,編碼的品質更應該受到關注。本文淺談 JavaScript