Time of Update: 2017-01-18
1.簡介最近在做一個大型網上銀行項目前端的最佳化,需要使用一個胖用戶端的最佳化,大概思路就是前端通過Ajax 請求去後端擷取資料,以Jason的格式返回,然後顯示在頁面上。由於這個系統非常龐大,胖用戶端方案難免需要在用戶端寫大量的JS代碼。我想對於任何團隊來說,大量的,非結構化的代碼維護起來都非常的不方便。所以BackBone進入了我的視線。它提供了一種途徑可以讓你結構化你的JS代碼,讓你以物件導向的方式來組織你的前端JS代碼。這就好比我們在前端應用Domain Driven Design.
Time of Update: 2017-01-18
大多數程式設計語言中,都有類和對象,一個類可以繼承其他類。在JavaScript中,繼承是基於原型的(prototype-based),這意味著JavaScript中沒有類,取而代之的是一個對象繼承另一個對象。:)1. 繼承, the proto在JavaScript中,當一個對象rabbit繼承另一了對象animal時,這意味著rabbit對象中將會有一個特殊的屬性:rabbit.__proto__ =
Time of Update: 2017-01-18
在js中有幾種模式可以建立對象,通過對象操作所包含的屬性與方法。一般來說,建構函式名稱的第一個字母為大寫字母,非建構函式名稱的第一個字母為小寫字母,當然,建構函式與一般函數唯一的區別只是調用的方式不同而已,所以任何函數只要通過new來調用,那它就可以作為建構函式,若不通過new來調用,則與一般函數一樣。談談我對這幾種模式的理解:原廠模式:建立一個一般函數,在函數裡建立一個Object對象,為這個對象增添屬性與方法,同時賦予其值,最後返回對象。無法識別物件類型。建構函式模式:建立建構函式,使用th
Time of Update: 2017-01-18
Object類型Array類型重排序方法: compare升序:function compare(value1, value2){ if (value1<value2){ return -1; } if (value1>value2){ return 1; } else{ return 0; }}var values = [0,1,5,10,15];values.sort(compare);console.log(values); // [0,1,5,10
Time of Update: 2017-01-18
節點類型nodeType以下是一些重要的nodeType的取值:1: 元素element2: 屬性attr3: 文本text8: 注釋comments9: 文檔documentnodeName,nodeValue節點關係childNodes: 每個節點都有一個childNodes屬性,其中儲存著一個NodeList對象firstChild: 等同於childNodes[0]lastChild:
Time of Update: 2017-01-18
JavaScript 中的繼承比較奇葩,無法實現介面繼承,只能依靠原型繼承。原型鏈原型就是一個對象,通過建構函式建立出來的執行個體會有指標指向原型得到原型的屬性和方法。這樣,執行個體對象就帶有建構函式的屬性方法和原型的屬性方法,然後將需要繼承的建構函式的原型指向這個執行個體,即可擁有這個執行個體的所有屬性方法實現繼承。看下面示範代碼://聲明超類,通過建構函式和原型添加有關屬性和方法function Super(){ this.property = true;}Super.prototype.
Time of Update: 2017-01-18
Backbone 中的 View 用來反映你 app 中 Model 的模樣。它們會監聽事件並作出相應的反應。接下來的教程我不會告訴你如何把 Model 和 Collection 綁定到 View 上,而是主要討論 View 是如何使用 javascript 模板庫的,尤其是 Underscore.js's _.template。這裡我們使用 jQuery 來操作 DOM 元素,當然你也可以使用其他的庫,例如 MooTools 或者 Sizzle,但是 Backbone 的官方文檔推薦我們使用
Time of Update: 2017-01-18
1. 不得不說說二叉樹要瞭解堆首先得瞭解一下二叉樹,在電腦科學中,二叉樹是每個節點最多有兩個子樹的樹結構。通常子樹被稱作“左子樹”(left subtree)和“右子樹”(right subtree)。二叉樹常被用於實現二叉尋找樹和二元堆積。二叉樹的每個結點至多隻有二棵子樹(不存在度大於 2 的結點),二叉樹的子樹有左右之分,次序不能顛倒。二叉樹的第 i 層至多有 2i - 1 個結點;深度為 k 的二叉樹至多有 2k - 1 個結點;對任何一棵二叉樹 T,如果其終端結點數為 n0,度為 2
Time of Update: 2017-01-18
知識說明:初學JavaScript,注意以下七大細節,在實現同樣功能的情況下,讓我們的代碼更易懂、效率更高。一、簡化代碼例如:建立對象之前是這樣的:Var car = new object();Car.color = “red”;Car.wheels = 4;Car.age = 8;而現在可以寫成這樣子:Var car = {color:'red', wheels:4, age:8}例如:建立數組之前是這樣的:Var studentArray = new Array(‘zhangsan',
Time of Update: 2017-01-18
sessionStorage 、localStorage 和 cookie 之間的共同點:都是儲存在瀏覽器端,且同源的。sessionStorage 、localStorage 和 cookie
Time of Update: 2017-01-18
每種程式設計語言,其變數都有一定的有效範圍,超過這個範圍之後,變數就失效了,這就是變數的範圍。從數學的角度來看,就是自變數的域。範圍是變數的可存取範圍,即範圍控制著變數與函數的可見度和生命週期。在 JavaScript 中, 對象和函數同樣也是變數,變數在聲明他們的函數體以及這個函數體嵌套的任意函數體內部都是有定義的。一、靜態範圍和動態範圍靜態範圍是指聲明的範圍是根據程式本文在編譯時間就確定的,也稱為詞法範圍。大多數現代程式設計語言都是採用靜態範圍規則,JavaScript就是採用的這種範圍。
Time of Update: 2017-01-18
javascript的BOM ECMAScript是 JavaScript的核心,但如果要在 Web中使用 JavaScript,那麼 BOM(瀏覽器物件模型)則無疑才是真正的核心。BOM 提供了很多個物件,用於訪問瀏覽器的功能,這些功能與任何網頁內容無關。多年來,缺少事實上的規範導致
Time of Update: 2017-01-18
String對象的擴充函數:String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g,""); } String.prototype.ltrim = function() { return this.replace(/^\s+/g,""); } String.prototype.rtrim = function() { return this.replace(/\s+$/g,""); } String.
Time of Update: 2017-01-18
回調地獄對 JavaScript 程式員來說,處理回調是家常,但是處理層次過深的回調就沒有那麼美好了,下面的範例程式碼片段用了三層回調,再補腦一下更多層的情境,簡直是酸爽,這就是傳說中的回調地獄。getDirectories(function(dirs) { getFiles(dirs[0], function(files) { getContent(files[0], function(file, content) { console.log('filename:',
Time of Update: 2017-01-18
探尋JavaScript中this指標指向首先必須要說的是,this的指向在函數定義的時候是確定不了的,只有函數執行的時候才能確定this到底指向誰,實際上this的最終指向的是那個調用它的對象(這句話有些問題,後面會解釋為什麼會有問題,雖然網上大部分的文章都是這樣說的,雖然在很多情況下那樣去理解不會出什麼問題,但是實際上那樣理解是不準確的,所以在你理解this的時候會有種琢磨不透的感覺),那麼接下來我會深入的探討這個問題。為什麼要學習this?如果你學過函數式編程,物件導向編程,那你肯定知道幹
Time of Update: 2017-01-18
JavaScript 是一種指令碼語言,支援函數式編程、閉包、基於原型的繼承等進階功能。JavaScript一開始看起來感覺會很容易入門,但是隨著使用的深入,你會發JavaScript其實很難掌握,有些基本概念讓人匪夷所思。其中JavaScript 中的 this 關鍵字,就是一個比較容易混亂的概念,在不同的情境下,this會化身不同的對象。有一種觀點認為,只有正確掌握了 JavaScript 中的 this 關鍵字,才算是邁入了 JavaScript 這門語言的門檻。在主流的物件導向的語言中(
Time of Update: 2017-01-18
在編寫js程式的過程中,可能常常需要判斷一個對象的類型,例如你寫了一個函數,需要通過判斷不同的參數類型來編寫不同的代碼。首先可能會想到typeof操作符,看下面的這個例子: <script type="text/javascript"> var object = {}; var b = true; alert(typeof object + " " + typeof b); </script>
Time of Update: 2017-01-18
冒泡排序樣本,雙向冒泡排序與對雙向冒泡排序稍微的改進的視覺效果。代碼很簡單,不知道有木有未知bug。大神請勿吐槽冒泡排序樣本var ls=[ 98,13,6,25,38,36,30,44,38,80,61,28,47,34,95,18,85,58,89,85,42,61,74,35,13,14,80,7,10,44,10,47,13,11,52,25,24,48,34,12,88,80,33,8,80,45,64,52,79,77 ]; for(var i=0;i<ls.length;i+
Time of Update: 2017-01-18
querySelector 和 querySelectorAll 方法是 W3C Selectors API 規範中定義的。他們的作用是根據 CSS 選取器規範,便捷定位文檔中指定元素。目前幾乎主流瀏覽器均支援了他們。包括 IE8(含) 以上版本、 Firefox、 Chrome、Safari、Opera。querySelector 和 querySelectorAll 在規範中定義了如下介面:module dom { [Supplemental, NoInterfaceObject]
Time of Update: 2017-01-18
在JS中,這三者都是用來改變函數的this對象的指向的,他們有什麼樣的區別呢。在說區別之前還是先總結一下三者的相似之處:1、都是用來改變函數的this對象的指向的。2、第一個參數都是this要指向的對象。3、都可以利用後續參數傳參。那麼他們的區別在哪裡的,先看一個例子。 var xw = { name : "小王", gender : "男", age : 24, say : function(