好好學一遍JavaScript 筆記(二)

 

/**
  * encodeURI跟encodeURIComponent的區別在於encodeURI不對
  * 特殊字符進行編碼如：冒號、前斜槓、問號和英鎊符號.
  * 而encodeURIComponent則對它發現的全部非標準字符進行編碼.
  */
 var d = "古道西風";
 //這樣的URL在後臺轉碼獲取事後就能夠解決get方式提交的亂碼問題了.
 <%--var url = "<%=path%>/users.action?name="+encodeURI(d);--%>
 //後臺action或者servlet這樣轉碼獲取
 //String Name=new String(URLDecoder.decode(request.getParameter("name"),"utf-8"));

 alert(encodeURI(d));
 alert(encodeURIComponent(d));

 /**
  * 天然還有解碼方法：decodeURI跟decodeURIComponent
  *
  */
 alert(decodeURI(encodeURI(d)));
 alert(decodeURIComponent(encodeURIComponent(d)));

javaScript——Math：

/**
  * 判斷一組數中的最大值
  */
 var iMax = Math.max(3,5,56,7,13,79);
 alert(iMax);

 /**
  * 判斷一組數中的最小值
  */
 var iMin = Math.min(3,5,56,7,13,79);
 alert(iMin);

 /**
  * 返回數字的絕對值
  */
 alert(Math.abs(-9));

/**
  * 把小數舍入成整數
  * ceil 表示向上取整
  * round 常規、4舍5入
  * floor 表示向下取整
  */
 alert(Math.ceil(25.1));  //out26
 alert(Math.round(25.6));  //out26
 alert(Math.floor(25.9));  //out25

//常數；一個用做天然對數的底的數學常數，表示爲 e。e 的近似值爲 2.718281828459045。
//alert(Math.E);
/**
 * exp()方法用於把Math.E升到指定的冪(mi)
 * log()方法用於返回特定的數字的天然對數
 * pow()方法用戶把指定的數字升到指定的冪
 * sqrt()返回指定數字的平方根
 * acos(x)       返回x的反餘弦值
 * asin(x)       返回x的反正弦值
 * atan(x)       返回x的反正切值
 * atan2(y,x)    返回y/x的反餘弦值
 * cos(x)        返回x的餘弦值
 * sin(x)        返回x的正弦值
 * tan(x)        返回x的正切值
 */
alert(Math.log(Math.exp(12)));

alert(Math.pow(2,10));  //1024

/**
 * 數字的平方根就是它的2/1次冪
 * 2的2/1次冪就是2的平方根
 */
alert(Math.sqrt(4));

/**
  * Math的random()方法
  * 該方法返回0到1之間的隨機數、不包括0和1
  */
 alert(Math.random());

 /**
  * 返回iFirstValue到iLastValue的之間(包括)的隨機數
  * @param {Object} iFirstValue 起始值
  * @param {Object} iLastValue 結束值
  * @return {TypeName}
  */
 function selectFrom(iFirstValue,iLastValue){
     var iChoices = iLastValue - iFirstValue + 1 ;
     return Math.floor(Math.random() * iChoices + iFirstValue) ;
 }
 //返回1到9的隨機數、包括1跟9
 alert(selectFrom(1,9));

 /**
  * 隨機獲取數組中的元素
  */
 var array = new Array(45,452,451,4,42,437,343);
 alert(array[selectFrom(0,array.length-1)]);

javaScript——建立對象(Object)：

類工廠方式：

/**
  * 類工廠
  */
 function createCar(sColor,iDoors,iMpg){
     var oTempCar = new Object;
     oTempCar.color = sColor;
     oTempCar.doors = iDoors ;
     oTempCar.mpg = iMpg ;
     oTempCar.showColor = function(){
         alert(this.color);
     };
     return oTempCar ;
 }
 var oCar1 = createCar("red",5,33);
 var oCar2 = createCar("blue",6,23);
 alert(oCar1.color);
 oCar2.showColor() ;

類工廠方式二：

/**
  * 類工廠2
  */
 function showColor(){
     alert(this.color);
 }

 function createCar(sColor,iDoors,iMpg){
     var oTempCar = new Object;
     oTempCar.color = sColor;
     oTempCar.doors = iDoors ;
     oTempCar.mpg = iMpg ;
     oTempCar.showColor = showColor;
     return oTempCar ;
 }
 var oCar1 = createCar("red",5,33);
 var oCar2 = createCar("blue",6,23);
 alert(oCar1.color);
 oCar2.showColor();

構造函數：

/**
  * 構造函數
  * @param {Object} sColor
  * @param {Object} iDoors
  * @param {Object} iMpg
  * @memberOf {TypeName}
  */
 function Car(sColor,iDoors,iMpg){
     this.color = sColor;
     this.doors = iDoors ;
     this.mpg = iMpg ;
     this.showColor = function(){
         alert(this.color);
     };
 }
 var oCar1 = new Car("red",5,33);
 var oCar2 = new Car("blue",6,23);
 alert(oCar1.color);
 oCar2.showColor();

原型方式：

/**
  * 原型方式
  */
 function Car(){
 }
 Car.prototype.color = "red";
 Car.prototype.doors = 2 ;
 Car.prototype.mpg = 23 ;
 Car.prototype.array = new Array(1,2);
 Car.prototype.showColor = function(){
     alert(this.color);
 };
 var oCar1 = new Car();
 var oCar2 = new Car();
 oCar1.color = "blue";
 oCar1.array.push(3,4) ;
 alert(oCar1.color);
 alert(oCar2.color);

 //因爲Array是引用值、array都指向一樣數組
 alert(oCar1.array);
 alert(oCar2.array);

聯合使用構造函數和原型方式：

/**
  * 聯合使用構造函數和原型方式、就可像用其餘程序設計語言同樣建立對象。
  * 這種概念很是簡單、即用構造函數定義對象的全部非函數屬性、用原型方式定義對象的函數屬性(方法)。
  * 結果全部函數都只建立一次、而每一個對象都具備本身的對象屬性實例。
  */
 function Car(sColor,iDoors,iMpg){
     this.color = sColor;
     this.doors = iDoors ;
     this.mpg = iMpg ;
     this.array = new Array(1,2);
     this.showColor = function(){
         alert(this.color);
     };
 }
 Car.prototype.array = function (){
     alert(this.color);
 };
 var oCar1 = new Car("red",5,33);
 var oCar2 = new Car("blue",6,23);
 oCar1.array.push(4,9);
 alert(oCar1.array);
 alert(oCar2.array);

動態原型方法：

/**
  * 動態原型方法
  */
 function Car(sColor,iDoors,iMpg){
     this.color = sColor;
     this.doors = iDoors ;
     this.mpg = iMpg ;
     if(typeof Car._initialized == "undefined"){
         Car.prototype.showColor = function(){
             alert(this.color);
         };
         Car._initialized = true ;
     }
 }
 var oCar1 = new Car("red",5,33);
 var oCar2 = new Car("blue",6,23);
 alert(oCar1.color);
 oCar2.showColor();

混合工廠方式：

/**
  * 混合工廠方式
  */
 function Car(){
     var oTempCar = new Object;
     oTempCar.color = "red";
     oTempCar.doors = 2 ;
     oTempCar.mpg = 23 ;
     oTempCar.showColor = function(){
         alert(this.color);
     };
     return oTempCar ;
 }
 var oCar1 = new Car();
 var oCar2 = new Car();
 alert(oCar1.color);
 oCar2.showColor();

利用json建立對象：

/**
  * 利用json建立對象
  */
 var Car = {};
 Car.color = "red";
 Car.doors = 2;
 Car.mpg = 23;
 Car.array = new Array(1,2);
 Car.showArray = function(){
   alert(this.array);
 };
var oCar = Car;
oCar.showArray();

目前使用最普遍的是混合的構造函數/原型方式。此外、動態原型方法也很流行、 在功能上與構造函數/原型方式等價。可採用這兩種方式的任何一種、 不過不要單獨使用經典的構造函數或原型方式、由於這樣會給代碼引入問題。