自学内容网 自学内容网

module模式

模块模式

比如使用IIFE创建了一个函数,由于之前使用IIFE本身只会在模块加载时候执行一次;但是模块中的导出可以被多次调用,反映了模块的可重用性;

const ShoppingCart2 = (function () {
  const cart = [];
  const shippingCost = 10;
  const totalPrice = 237;
  const totalQuantity = 23;
  const addToCart = function (product, quantity) {
    cart.push({ product, quantity });
    console.log(`${quantity} ${product}加入购物车`);
  };
  const orderStock = function (product, quantity) {
    console.log(`${quantity} ${product}已经被订购`);
  };
  return {
    addToCart,
    cart,
    totalPrice,
    totalQuantity,
  };
})();
ShoppingCart2.addToCart('苹果', 4);
ShoppingCart2.addToCart('梨子', 7);
console.log(ShoppingCart2);

在这里插入图片描述

  • 但是只有模块是可以复用的,IIFE中定义的其他参数是私有化的,不可访问;
console.log(ShoppingCart2.shippingCost);

在这里插入图片描述

  • 所以呢,通过return,我们可以把私有化的模块给公开化;所以呢这也存在一定的局限性
    • 这样直接访问私有变量甚至可以直接改变私有变量的方式可能会导致一些数据不一致或者错误的情况;
    • 缺乏封装性,这里需要放开的东西并不是整体的一个功能,只是添加到购物车的功能;
    • 由于设计上越复杂,可能维护更难,很难去弄清楚哪个是公共模块,哪个是私有实现;

原文地址:https://blog.csdn.net/weixin_42952508/article/details/145169271

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!