JS雜談

JS的變數

千萬不要小看了變數的宣告

這是JS神奇的部份之一

JS的宣告

JS的變數可以在使用後才宣告

而且還不會是全域變數

JS的變數宣告是hoisted...

實際案例

JS的初始化

JS的變數初始化並沒有hoisted

先初始化後初始化會有差別

使用前初始化

使用後初始化

先宣告使用後初始化

提醒各位

雖然JS會將變數宣告提到最前面

但是還是請各位將變數宣告寫在最前面...

接下來

介紹一下JS的嚴格模式

嚴格模式

在JavaScript1.8.5時可使用

只是個字面常數不是敘述

會被不支援的瀏覽器忽略

變數指派

指派物件

函式參數

兩個相同的參數其實本來不會錯...

八進位字面常數

唯讀屬性

特別變數名稱

eval可以用來對字串賦值

字串賦值

為了安全因素所以不能創造變數

不要忘了

雖然有嚴格模式的字串可以用

但是一定要寫在第1行才行

接下來

講解JS常見的錯誤

常見錯誤

不能說都是你的錯

但是也不能都怪JS...

條件敘述

把if條件的相等寫成指派

var odov="od'_'ov"
if(odov="apple"){alert("XXXXRAT")}

如何避免

把常數寫在左邊寫錯就會炸

var odov="od'_'ov"
if("apple"=odov){alert("XXXXRAT")}

比較運算

var e=666
var f="666"
alert(e==f)

不要以為這樣是對的

var g=011
var h="011"
alert(g==h)

型別轉換有風險詳情請見JS規格書

如何避免

記得使用3個等號===的比較

var m=223
var n="223"
alert(m===n)

加法和串接

字串和數字的加法是不一樣的

小心變數所使用的型別

實際案例

var num=10
var str="5"
var res=num+str

錯誤的分號

if(false);
{
	alert("RRRR")
}

就這樣莫名其妙地執行了

接下來

講解如何增進JS執行效能

增進效能

很簡單就先灌V8引擎

當然還是要靠使用者的技術啦

迴圈限制外置

將迴圈的限制值放在for外面

才不會每次都去算

此方法各語言通用

實際案例

var limit=arr.length
for(var i=0;i<limit;i++)

迴圈次數愈多效益愈高

降低DOM取用

取用HTML的DOM是很慢的動作

取到節點後就用變數存起來

對於高消耗的取用都可以適用

實際案例

obj = document.getElementById("demo");
obj.innerHTML = "Hello";

減少DOM大小

儘量讓HTML的節點愈少愈好

加速網頁載入以及渲染

當然對搜尋元素也很有利

減少不必要的變數

雖然說把變數東拼西湊後取名比較好

不過只用一次的變數還是免了吧...

指令稿延遲載入

將JS的程式放在網頁的最後

最好加上個onload時才執行所需程式碼

接下來

講解神奇的閉包

閉包

上次建構子不小心用到了

將所能取得的變數環境記起來

變數會和函式一起存在

作用域

function init() {
	var name = "Nekomimi"
	function display() {
		alert(name)
	}
	display()
}

閉包

function init() {
	var name = "Nekomimi"
	function display() {
		alert(name)
	}
	return display
}

限制成員存取

可以用閉包取得別人無法取得的作用域

把東西藏起來不給別人改

計數器

最簡單的回傳物件

function Counter(){
	var count=0
	return {
		add:function(){count+=1;},
		num:function(){return count;}
	}
}

計數器

複雜一點的回傳物件

function Counter(){
	var count=0
	return new (function(){
		this.add=function(){count+=1;}
		this.num=function(){return count;}
	})
}

閉包

其實不只是JavaScript有閉包

連C++11也支援啦！！

概念學起來到處可以用