Number
是內置構造函數，用來創建數值
const price =12.345console.log(price.toFixed(2))//保留兩位小數 12.35綜合案例購物車
<body><div class="list"><!-- <div class="item"><img src="https://yanxuan-item.nosdn.127.net/84a59ff9c58a77032564e61f716846d6.jpg" alt=""><p class="name">稱心如意手搖咖啡磨豆機咖啡豆研磨機 <span class="tag">【贈品】10優惠券</span></p><p class="spec">白色/10寸</p><p class="price">289.90</p><p class="count">x2</p><p class="sub-total">579.80</p></div> --></div><div class="total"><div>合計：<span class="amount">1000.00</span></div></div><script>const goodsList = [{id: '4001172',name: '稱心如意手搖咖啡磨豆機咖啡豆研磨機',price: 289.9,picture: 'https://yanxuan-item.nosdn.127.net/84a59ff9c58a77032564e61f716846d6.jpg',count: 2,spec: { color: '白色' }},{id: '4001009',name: '竹制干泡茶盤正方形瀝水茶臺品茶盤',price: 109.8,picture: 'https://yanxuan-item.nosdn.127.net/2d942d6bc94f1e230763e1a5a3b379e1.png',count: 3,spec: { size: '40cm*40cm', color: '黑色' }},{id: '4001874',name: '古法溫酒汝瓷酒具套裝白酒杯蓮花溫酒器',price: 488,picture: 'https://yanxuan-item.nosdn.127.net/44e51622800e4fceb6bee8e616da85fd.png',count: 1,spec: { color: '青色', sum: '一大四小' }},{id: '4001649',name: '大師監制龍泉青瓷茶葉罐',price: 139,picture: 'https://yanxuan-item.nosdn.127.net/4356c9fc150753775fe56b465314f1eb.png',count: 1,spec: { size: '小號', color: '紫色' },gift: '50g茶葉,清洗球,寶馬, 奔馳'}]// 1. 根據數據渲染頁面document.querySelector('.list').innerHTML = goodsList.map(item => {// console.log(item) // 每一條對象// 對象解構 item.price item.countconst { picture, name, count, price, spec, gift } = item// 規格文字模塊處理const text = Object.values(spec).join('/')// 計算小計模塊 單價 * 數量 保留兩位小數 // 注意精度問題，因為保留兩位小數，所以乘以 100 最后除以100const subTotal = ((price * 100 * count) / 100).toFixed(2)// 處理贈品模塊 '50g茶葉,清洗球'const str = gift ? gift.split(',').map(item => `<span class="tag">【贈品】${item}</span> `).join('') : ''
//標簽前面不能多打空格return `<div class="item"> <img src=${picture} alt=""><p class="name">${name} ${str} </p><p class="spec">${text} </p><p class="price">${price.toFixed(2)}</p><p class="count">x${count}</p><p class="sub-total">${subTotal}</p></div>`}).join('')// 3. 合計模塊const total = goodsList.reduce((prev, item) => prev + (item.price * 100 * item.count) / 100, 0)// console.log(total)document.querySelector('.amount').innerHTML = total.toFixed(2)</script>
</body>面向對象和面向過程
構造函數
封裝是面向對象思想中比較重要的一部分，js面向對象可以通過構造函數實現的封裝。
同樣的將變量和函數組合到了一起并能通過 this 實現數據的共享，所不同的是借助構造函數創建出來的實例對象之間是彼此不影響的。
總結：
1. 構造函數體現了 面向對象的封裝特性
2. 構造函數實例創建的對象彼此獨立、互不影響
面向對象編程的特性：比如封裝性、繼承性等，可以借助于構造函數來實現
但是 存在浪費內存的問題
// 構造函數 公共的屬性和方法 封裝到 Star 構造函數里面了
function Star(uname, age) {
this.uname = uname
this.age = age
this.sing = function () {
console.log('唱歌')
const ldh = new Star（'劉德華'，55）
const zxy = new Star（'張學友'，58）//console.log(ldh === zxy)
console.log(ldh.sing === zxy.sing)//false原型
構造函數通過原型分配的函數是所有對象所 共享的 。
- JavaScript 規定， 每一個構造函數都有一個 prototype 屬性 ，指向另一個對象，所以我們也稱為原型對象。?
- 這個對象可以掛載函數，對象實例化不會多次創建原型上函數， 節約內存 。
- 可以把那些不變的方法直接定義在 prototype 對象上，這樣所有對象的實例都可以共享這些方法。
- 構造函數和原型對象中的 this 都指向 實例化的對象。
this
構造函數和原型對象中的this 都指向?實例化的對象
<script>let thatfunction Star(uname) {// that = this// console.log(this)this.uname = uname}// 原型對象里面的函數this指向的還是 實例對象 ldhStar.prototype.sing = function () {that = thisconsole.log('唱歌')}// 實例對象 ldh // 構造函數里面的 this 就是 實例對象 ldhconst ldh = new Star('劉德華')ldh.sing()console.log(that === ldh)</script>![【代碼隨想錄】【算法訓練營】【第66天】 [卡碼95]城市間貨物運輸II [卡碼96]城市間貨物運輸III](http://pic.xiahunao.cn/【代碼隨想錄】【算法訓練營】【第66天】 [卡碼95]城市間貨物運輸II [卡碼96]城市間貨物運輸III)
)
)
