javascript - 一直搞不懂闭包问题，这次开发真的遇上了，求解决办法，要求各product分别展示出各自的属性

问题描述

问 题

$(document).ready(function() {
    function product(name, description, price) {
        this.name = name;
        this.des = description;
        this.price = price;
    }
var product1 = new product("iphone", "手机", 3200);
    var product2 = new product("huawei", "手机", 1800);
    var product3 = new product("nicai", "手机", 998);
    var product4 = new product("sansung", "手机", 3000);
    var product5 = new product("opera", "手机", 2000);
    var products = [product1, product2, product3, product4, product5];
    for(var j=0;j<products.length;j++) {
        var pname = document.getElementsByClassName("pname")[j];
        var pdes = document.getElementsByClassName("pdes")[j];
        var pprice = document.getElementsByClassName("pprice")[j];
        for(var i=0;i<products.length;i++) {
            pname.innerHTML = products[i].name;
            pdes.innerHTML = products[i].des;
            pprice.innerHTML = products[i].price;
        }
    }
    });

解决方案

$(document).ready(function() {
    function product(name, description, price) {
        this.name = name;
        this.des = description;
        this.price = price;
    }
    var product1 = new product("iphone", "手机", 3200);
    var product2 = new product("huawei", "手机", 1800);
    var product3 = new product("nicai", "手机", 998);
    var product4 = new product("sansung", "手机", 3000);
    var product5 = new product("opera", "手机", 2000);
    var products = [product1, product2, product3, product4, product5];


    for(var j=0;j<products.length;j++) {
        (function (product, j) {
            var pname = document.getElementsByClassName("pname")[j];
            var pdes = document.getElementsByClassName("pdes")[j];
            var pprice = document.getElementsByClassName("pprice")[j];

            pname.innerHTML = product.name;
            pdes.innerHTML = product.des;
            pprice.innerHTML = product.price;

        })(products[j], j)
    }
});

你应该是要这个效果吧

这篇关于javascript - 一直搞不懂闭包问题，这次开发真的遇上了，求解决办法，要求各product分别展示出各自的属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！