微信小程序使用第三方库Immutable.js实例详解

 更新时间:2016年09月27日 10:42:31   投稿:daisy  
Immutable 是 Facebook 开发的不可变数据集合。不可变数据一旦创建就不能被修改,是的应用开发更简单,允许使用函数式编程技术,比如惰性评估。微信小程序无法直接使用Immutable.js,下面就来说说微信小程序如何使用第三方库Immutable.js。

前言

Immutable JS 提供一个惰性 Sequence,允许高效的队列方法链,类似 map 和 filter ,不用创建中间代表。immutable 通过惰性队列和哈希映射提供 Sequence, Range, Repeat, Map, OrderedMap, Set 和一个稀疏 Vector。

微信小程序无法直接使用require( 'immutable.js' )进行调用,需要对下载的Immutable代码进行修改,才能使用。

原因分析

Immutable使用了UMD模块化规范

(function (global, factory) {
 typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
 typeof define === 'function' && define.amd ? define(factory) :
 (global.Immutable = factory());
}(this, function () { 'use strict';var SLICE$0 = Array.prototype.slice;

....

}));

UMD的实现很简单,先判断是否支持Node.js(CommonJS)模块规范,存在则使用Node.js(CommonJS)方式加载模块。再判断是否支持AMD,存在则使用AMD方式加载模块。前两个都不存在,则将模块公开到全局。

exports、module必须都有定义,才能以CommonJS加载模块。通过测试,微信小程序运行环境exports、module并没有定义。

解决方法

修改Immutable代码,注释原有模块导出语句,使用module.exports = factory() 强制导出

(function(global, factory) {
 /*
 typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
 typeof define === 'function' && define.amd ? define(factory) :
 (global.Immutable = factory());
 */

 module.exports = factory();

}(this, function() {

使用Immutable.js

//index.js

var Immutable = require( '../../libs/immutable/immutable.modified.js' );

//获取应用实例
var app = getApp();

Page( {

 onLoad: function() {
 //console.log('onLoad');
 var that = this;

 var lines = [];

 lines.push( "var map1 = Immutable.Map({a:1, b:2, c:3});" );
 var map1 = Immutable.Map({a:1, b:2, c:3});
 lines.push( "var map2 = map1.set('b', 50);" );
 var map2 = map1.set('b', 50);
 lines.push( "map1.get('b');" );
 lines.push(map1.get('b'));
 lines.push( "map2.get('b');" );
 lines.push(map2.get('b')); 

 this.setData( {
  text: lines.join( '\n' )
 })
 }
})

总结

以上就是这篇文章的全部内容了,希望能对大家的学习或者工作带来一定的帮助,如果有疑问大家可以留言交流。

相关文章

  • 使用JS组件实现带ToolTip验证框的实例代码

    使用JS组件实现带ToolTip验证框的实例代码

    这篇文章主要介绍了使用JS组件实现带ToolTip验证框的实例代码,需要的朋友可以参考下
    2017-08-08
  • 微信小程序自定义日期选择器

    微信小程序自定义日期选择器

    这篇文章主要为大家详细介绍了微信小程序自定义日期选择器,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下<BR>
    2022-01-01
  • JS Canvas接口和动画效果大全

    JS Canvas接口和动画效果大全

    这篇文章主要介绍了JS Canvas接口和动画效果大全,对Canvas感兴趣的同学,可以参考下
    2021-04-04
  • JS实现打砖块游戏

    JS实现打砖块游戏

    这篇文章主要为大家详细介绍了JS实现打砖块游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-02-02
  • js点击返回跳转到指定页面实现过程

    js点击返回跳转到指定页面实现过程

    这篇文章主要为大家详细介绍了js点击返回跳转到指定页面实现过程,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-04-04
  • 原生JavaScript实现网页版计算器

    原生JavaScript实现网页版计算器

    这篇文章主要为大家详细介绍了原生JavaScript实现网页版计算器,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-11-11
  • JS对select控件option选项的增删改查示例代码

    JS对select控件option选项的增删改查示例代码

    Javascript操作select是表单中比较常见的,大家可以在网上搜索到很多的相关资料,接下来为大家详细介绍下,JS动态操作select中的各种方法,感兴趣的朋友可以参考下
    2013-10-10
  • webpack 开发和生产并行设置的方法

    webpack 开发和生产并行设置的方法

    这篇文章主要介绍了webpack 开发和生产并行设置的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-11-11
  • 浅谈JavaScript中小数和大整数的精度丢失

    浅谈JavaScript中小数和大整数的精度丢失

    下面小编就为大家带来一篇浅谈JavaScript中小数和大整数的精度丢失。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-05-05
  • 封装一个公用Echarts图表组件的3种模板代码示例

    封装一个公用Echarts图表组件的3种模板代码示例

    这篇文章主要给大家介绍了关于封装一个公用Echarts图表组件的3种模板,定义图表公共样式是为了统一同一网站各页面图表的基础样式,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-02-02

最新评论