promise 请求封装方法

使用promise把请求封装成一个方法，使用封装好的这个方法去请求json数据。

做了一个简单的购物车添加商品~

效果图：

 代码演示：

html代码段：

<div>
     <h4>产品列表</h4>
     <table border="0" id="box"></table>
     <h4>我的购物车</h4>
     <table id="cars" border="0"></table>
</div>

js代码段：

// 封装ajax Promise请求
        function ajax(url, type, async = false, data) {
            return new Promise((resolve, reject) => {
                $.ajax({
                    url,
                    type,
                    async,
                    data,
                    success(res) {
                        resolve(res)
                    },
                    error(err) {
                        reject(err)
                    }
                })
            })
        }
        ajax("goods.json","get", true).then((data) => {
            let box = document.getElementById("box")
            for (let i = 0; i < data.length; i++) {
                let str = `
                    <tr>
                        <td>${data[i].name}</td>
                        <td><button type="button">添加</button></td>
                    </tr>`
                box.innerHTML += str //渲染购物车
            }
            let btn = document.getElementsByTagName("button"); //获取添加按钮
            let cars = []; //购物车数组
            let shopping = document.getElementById("cars") //购物车id
            let ind = 0; //购物车tr的id
            for (let i = 0; i < btn.length; i++) {
                btn[i].onclick = function() { //给按钮添加点击事件
                    let car = $(this).parent().prev().text() //获取需添加的产品
                    let index = cars.findIndex(item => item == car); //产品和购物车数据进行操作
                    if (index == -1) { //根据对比的结果进行操作
                        cars.push(car) //购物车没有此产品,需要添加进去,且显示页面
                        //拼接 给每一行添加一个id
                        let str = `
                        <tr id="row${ind}">
                            <td>${car}</td>
                            <td>1</td>
                        </tr>`
                        shopping.innerHTML += str //渲染购物车
                        ind++; //数量++
                    } else { //购物车有此产品,只需要数量+1即可
                        //根据index+row进行拼接获取添加的产品在购物车表格中的数据
                        let cols = document.getElementById("row" + index).cells; //cells获取到所有的表格
                        let number = parseInt(cols[1].innerHTML); //字符串转型
                        cols[1].innerHTML = ++number //数量++
                    }
                }
            }
        }).catch((err) => {
            console.log(err)
        })