js get set访问器及日期扩展?

Posted sanerandm

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js get set访问器及日期扩展?相关的知识,希望对你有一定的参考价值。

  1 <!DOCTYPE html>
  2 <html>
  3 <head lang="en">
  4     <meta charset="UTF-8">
  5     <title></title>
  6 </head>
  7 <body>
  8 <div id="itemInfo">
  9     <div id="name">
 10         <h1 id="pname">乐视TV( Letv) S50 Air 全配版 50英寸2D智能LED液晶 超级电视</h1>
 11         <div id="pdes">各地区货源已陆续到库,我们将在十月十号左右发货,对于此次延迟发货给您带来的不便表示致歉,望您谅解。</div>
 12         <div >已售:<strong id="psales">6000</strong></div>
 13         <div>原价:<strong id=‘pprice‘>6000</strong>元</div>
 14         <div>优惠价:<strong id=‘pyouhui‘>5000</strong>元</div>
 15         <div>折扣:<strong id=‘pzhekou‘>6.0</strong>折</div>
 16         <div>生产日期:<strong id=‘date‘>2015-09-09</strong></div>
 17     </div>
 18 </div>
 19 <button id=‘btn‘>加入购物车</button>
 20 
 21 </body>
 22 </html>
 23 
 24 <script>
 25  var price = document.getElementById(‘pprice‘).value;
 26  var productDate = document.getElementById(‘date‘).value;
 27  function dateFormat(date,format) {
 28         var o = {
 29             "M+" : date.getMonth()+1, //month
 30             "d+" : date.getDate(),    //day
 31             "h+" : date.getHours(),   //hour
 32             "m+" : date.getMinutes(), //minute
 33             "s+" : date.getSeconds(), //second
 34             "q+" : Math.floor((date.getMonth()+3)/3),  //quarter
 35             "S" : date.getMilliseconds() //millisecond
 36         }
 37         if(/(y+)/.test(format)) format=format.replace(RegExp.$1,
 38                 (date.getFullYear()+"").substr(4- RegExp.$1.length));
 39         for(var k in o)if(new RegExp("("+ k +")").test(format))
 40             format = format.replace(RegExp.$1,
 41                     RegExp.$1.length==1? o[k] :
 42                             ("00"+ o[k]).substr((""+ o[k]).length));
 43         return format;
 44     }
 45 function Product() {
 46     this.name = ‘‘;
 47     this.price = 0;
 48     this.description = ‘‘;
 49     this.zhekou = 0;
 50     this.sales = 0;
 51     this.productDate= ‘‘;
 52     //get set 取值器 设置器
 53     /*我们的需求:自动计算打折后的价格*/
 54     Object.defineProperty(this,"price",{
 55         get: function () {
 56             return price * 0.9;
 57         },
 58         set: function (value) {
 59             /*大概普通产品的价格都在0-1w*/
 60             if(value > 10000){
 61                 alert(‘产品价格必须在0-10000之间‘);
 62             }else {
 63                 price = value;
 64             }
 65         }
 66     });
 67     //给属性添加权限 defineProperty
 68     Object.defineProperty(this,"price",{
 69         value:50000,
 70         writable:false
 71     });
 72     Object.defineProperty(this,"productDate",{
 73         get: function () {
 74             return dateFormat(productDate,"yyyy-MM-dd");
 75         },
 76         set: function (value) {
 77             productDate = value;
 78         }
 79     });
 80    
 81 }
 82 Product.prototype = {
 83     // getPrice: function () {
 84     //     return this.price;
 85     // },
 86     addToCart: function () {
 87         alert(‘添加商品到购物车‘);
 88 
 89     },
 90     init: function () {
 91         this.bindDom();
 92         this.bindEvents();
 93     },
 94     bindDom: function () {
 95         //获取元素
 96         var btn = document.getElementById(‘btn‘);
 97         var pname = document.getElementById(‘pname‘);
 98         var pprice = document.getElementById(‘pprice‘);
 99         var sum = document.getElementById(‘sum‘);
100         var des = document.getElementById(‘pdes‘);
101         var youhuijia = document.getElementById(‘pyouhui‘);
102         var zhekou = document.getElementById(‘pzhekou‘);
103         var sales = document.getElementById(‘psales‘);
104         var date = document.getElementById(‘date‘);
105         /*绑定元素*/
106         /*通过点语法访问对象中的属性或者方法*/
107         pname.innerHTML=this.name;
108         pprice.innerHTML=this.price;
109         des.innerHTML=this.description;
110         youhuijia.innerHTML=this.youhuijia;
111         zhekou.innerHTML=this.zhekou;
112         sales.innerHTML=this.sales;
113         date.innerHTML = this.productDate;
114 
115     },
116     bindEvents: function () {
117         // var btn = document.getElementById(‘btn‘);
118         var that = this;
119         btn.onclick = function () {
120             that.addToCart();
121         }
122     }
123 }
124 
125     
126     
127 
128 window.onload = function () {
129     var iphone = new Product();
130     iphone.name = ‘iphone7‘;
131     iphone.price = 10000;
132     iphone.description=‘手机中的战斗机‘;
133     iphone.youhuijia=3000;
134     iphone.zhekou=3.0;
135     iphone.sales=40000;
136     iphone.productDate = new Date();
137 
138     iphone.init();
139     
140    
141     
142     
143         
144 }
145 </script>

 

以上是关于js get set访问器及日期扩展?的主要内容,如果未能解决你的问题,请参考以下文章

JVM类加载器及Java类的生命周期

JS对象属性中get/set与getter/setter是什么

js中set和get的用法

Python snippet(代码片段)

Wordpress阻止访问wp admin€“wpsnipp.com网站你博客的Wordpress代码片段

熟悉JS中的常用选择器及属性方法的调用