2014年4月20日 星期日

JavaScript toString( ) and valueOf


  • toString() , valueOf()  與 Java 、 ActionScript3 基本原理相似。


 (function(){

     Object.prototype.valueOf = function(){
        return 6;
    }
    
    Object.prototype.toString = function(){
        return 10;
    }
    var val2 = {
        x:2 ,
        y:3
    };    
    
    alert(val2);     //10
    alert(val2 * 2 );//12 遇到算數運算會隱含調用Object的valueOf()
    
    var val3 = {
        x:5 ,
        y:6 ,
        toString:function( ){
            return '龍虎門';
        }
   };
   
   alert(val3);     //龍虎門 調用toString()
         
 })();    
張貼者： 於 沒有留言:
標籤： ,

JavaScript Array native function

   Array Native   forEach

    var data = [3,5,6,9,7,8,4,3,2,1];
    var str = '';
    //array native forEach
    data.forEach(function(e){
          str += e + ',';
    });
    //print 3,5,6,9,7,8,4,3,2,1
    console.log(str.substring(0,str.length-1));
 

Array Native Sort 
    var data = [3,5,6,9,7,8,4,3,2,1];
    var str = '';    
    data.sort();    
    data.forEach(function(e){
          str += e + ',';
    }); 
    //1,2,3,3,4,5,6,7,8,9 
    console.log(str.substring(0,str.length-1)); 


Customer  Compare Funciton
    var data = [3,5,6,9,7,8,4,3,2,1];
    var str = '';    
    function compare(a,b){        
        return b - a;        
    }              
    data.sort(compare); 
    data.forEach(function(e){
          str += e + ',';
    });
    //9,8,7,6,5,4,3,3,2,1     
    console.log(str.substring(0,str.length-1)); 

張貼者： 於 沒有留言:
標籤：

2014年4月19日 星期六

輸出三角形

想輸出

*
**
***
**
*

一開始學程式時會寫雙迴圈
後來利用%可以只單迴圈

最近有靈感這麼用

 function draw(count){
   var bag='',i=0,e=count;       
   while(i < e || count-- > 0){
     var out = (i++ < e) ?  (bag+='*')  :   bag.substring(0,count);            
           console.log(out);
   }      
}        
draw(3);
 
張貼者： 於 沒有留言:
標籤： ,

2014年4月15日 星期二

常用術語收集

Memory Leak  記憶體漏洩
張貼者： 於 沒有留言:
標籤：

2014年4月14日 星期一

application/x-www-form-urlencoded

Jquery ajax contentType 預設為： 'application/x-www-form-urlencoded; charset=UTF-8' 

 可用有：

  • application/x-www-form-urlencoded
  • application/json
  • text/xml

要注意：如果不是使用 application/x-www-form-urlencoded  在Servlet端 無法從request.getparameter(key)，取回資料，只能從StreamInput中取得。
 form 的enctype 發送格式預設是 ：'application/x-www-form-urlencoded;
可用有：

  • application/x-www-form-urlencoded
  • multipart/form-data
  • text/plain
張貼者： 於 沒有留言:
標籤： ,

jsrender 範例

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <meta name="author" content="hua" />
    <script src="../js/jquery-1.8.1.min.js"></script>  
    <script src="../js/jsrender.min.js"></script>
    <style>
    .table201404120200{      
    }
 
    .table201404120200  td{
            border: solid 1px #CCCCCC;
        }
    </style>
</head>
<body>
    <div id="content20140412">      
    </div>
     
    <!--jsrender 樣板宣告  (主樣板)-->
    <script id="mainTmpl201404120200" type="text/x-jsrender">
        <table width="400px" class='table201404120200'>
            <thead>
                <tr ><th colspan="4">{{:title}}</th></tr>              
            </thead>
            <tbody>
                <tr>
                    <td>品名</td>
                    <td>數量</td>
                    <td>成本</td>
                    <td>售價</td>          
                    <td>價差</td> <!--呼叫 js method-->
                    <td>價差*2</td>
                    <td>index</td>
                    <td>color</td>
                </tr>  
                </tr>  
                {{for data tmpl="#reportTmpl201404120200" /}}
            </tbody>          
        </table>
    </script>
    <!--jsrender 樣板宣告   (子樣板)-->
    <script id="reportTmpl201404120200" type="text/x-jsrender">
        <tr>
            <td>{{: nam }}</td>
            <td>{{: quantity }}</td>
            <td>{{: cost }}</td>
            <td>{{: price}}</td>          
            <td>{{: ~method( price , cost)}}</td> <!--呼叫 js method-->
            <td>{{: ~method( price , cost) * 2}}</td> <!--呼叫 js method-->
            <td>{{: #index }}</td>
            {{if #index % 2 == 0}}
                <td style="background:#FF0080 ">#FF0080</td>
            {{else}}
                <td style="background:#FF8000 ">#FF8000</td>
            {{/if}}          
         
        </tr>      
    </script>
 
    <script>
       (function(){
        //資料,以資料驅動畫面
          var report = {
                title : '貨品資訊列表',
                data : [
                    {
                        nam : '精工表',
                        quantity : 2,
                        cost : 10000,
                        price : 30000,                      
                    },
                                        {
                        nam : '魯夫公仔',
                        quantity : 20,
                        cost : 100,
                        price : 399,                      
                    },
                                        {
                        nam : 'RX-78 RG 1/144',
                        quantity : 10,
                        cost : 500,
                        price : 1000,                      
                    }
                ]              
          };
       
           function difference(price, cost){
              return price - cost;
          }

        
          var html = $("#mainTmpl201404120200").render(report , {method : difference});
          //console.log(html);
          $('#content20140412').html(html);
       })();
    </script>
</body>
張貼者： 於 沒有留言:
標籤： ,
訂閱： 文章 (Atom)