一、文件作用域

  在 JavaScript 文件中声明的变量和函数只在该文件中有效;不同的文件中可以声明相同名字的变量和函数,不会互相影响。

通过全局函数 getApp() 可以获取全局的应用实例,如果需要全局的数据可以在 App() 中设置,如:

// app.js
App({
  globalData:{
    appName : "hcoder",
    appVersion : "1.1"
  }
})

// index.js
var app;
Page({
  data:{

  },
  onLoad:function(){
    app = getApp();
    this.setData({"appName":app.globalData.appName});
    this.setData({"appVersion":app.globalData.appVersion});
  }
})

//index.wxml
<text>
{{appName}}
{{appVersion}}
</text>

也可以在App()中创建自定义全局函数,在 App全局中使用getApp()获取到的全局应用实例来调用此方法。

二、模块化

  在我们开发过程中,可能会有很多公共的方法,我们可以将一些公共的代码抽离成为一个单独的 js 文件,作为一个模块。

模块只有通过 module.exports 或者 exports 才能对外暴露接口。

  需要注意的是:

  exports 是 module.exports 的一个引用,因此在模块里边随意更改 exports 的指向会造成未知的错误。所以我们更推荐开发者采用 module.exports 来暴露模块接口,除非你已经清晰知道这两者的关系。

  小程序目前不支持直接引入 node_modules , 开发者需要使用到 node_modules 时候建议拷贝出相关的代码到小程序的目录中。

1.在公共.js文件中声明方法,并使用 module.exports 或者 exports 对外暴露接口

// common.js
function sayHello(name) {
  console.log(`Hello ${name} !`)
}
function sayGoodbye(name) {
  console.log(`Goodbye ${name} !`)
}

module.exports.sayHello = sayHello
exports.sayGoodbye = sayGoodbye

2.在需要使用这些模块的文件中,使用 require(path) 将公共代码引入,使用引用实例进行公共方法的调用

tip:require为common.js相对当前文件的相对路径,目前不支持绝对路径

var common = require('../../common.js') Page({   helloMINA: function() {     common.sayHello('MINA')   },   goodbyeMINA: function() {     common.sayGoodbye('MINA')   } })

微信小程序自学第三课:文件作用域,模块化的更多相关文章

  1. 微信小程序自学第四课:数据绑定

    WXML 中的动态数据均来自对应 Page 的 data. 一.简单绑定 数据绑定使用 Mustache 语法(双大括号)将变量包起来,可以作用于: 1.内容 <view> {{ mess ...

  2. 微信小程序自学第五课:条件渲染、列表渲染

    一.条件渲染 1. wx:if 在框架中,我们用 wx:if="{{condition}}" 来判断是否需要渲染该代码块: <view wx:if="{{condi ...

  3. 微信小程序把玩(三十一)wx.uploadFile(object), wx.downloadFile(object) API

    原文:微信小程序把玩(三十一)wx.uploadFile(object), wx.downloadFile(object) API 反正我是没有测通这两个API!!!!不知道用的方式不对还是其他的!! ...

  4. 微信小程序把玩(三十九)navigation API

    原文:微信小程序把玩(三十九)navigation API 演示效果也看到了小程序也就提供这几个处理导航控制.值得注意的是只能同时导航五个页面 主要属性: 导航条一些方法 wx.setNavigati ...

  5. 使用wepy开发微信小程序商城第三篇:购物车(布局篇)

    使用wepy开发微信小程序商城 第三篇:购物车(布局篇) 前两篇如下: 使用wepy开发微信小程序商城第一篇:项目初始化 使用wepy开发微信小程序商城第二篇:路由配置和页面结构 基于上两篇内容,开始 ...

  6. 微信小程序把玩(三十三)Record API

    原文:微信小程序把玩(三十三)Record API 其实这个API也挺奇葩的,录音结束后success不走,complete不走,fail也不走, 不知道是不是因为电脑测试的原因,只能等公测或者等他们 ...

  7. 微信小程序把玩(三十四)Audio API

    原文:微信小程序把玩(三十四)Audio API 没啥可值得太注意的地方 重要属性: 1. wx.getBackgroundAudioPlayerState(object) 获取播放状态 2.wx.p ...

  8. 微信小程序把玩(三十五)Video API

    原文:微信小程序把玩(三十五)Video API 电脑端不能测试拍摄功能只能测试选择视频功能,好像只支持mp4格式,值得注意的是成功之后返回的临时文件路径是个列表tempFilePaths而不是tem ...

  9. 微信小程序把玩(三十六)Storage API

    原文:微信小程序把玩(三十六)Storage API 其实这个存储在新建Demo的时候就已经用到了就是存储就是那个logs日志,数据存储主要分为同步和异步 异步存储方法: 存数据 wx.setStor ...

随机推荐

  1. RabbitMQ事务确认机制(生产者)

    消息确认机制 生产者 消费者 消费者如何确保消息一定消费成功 队列和消费者建立长连接,推送或者拉取形式. 消费者通过自动应答或者手动应答,队列服务器等待应答结果,如果没有应答结果那么保留给下一个消费者 ...

  2. Spring- 通过Xml的方式完成Bean的实例化

    传统应用程序可以通过反射方式进行实例化Bean,而Spring Ioc 容器则需要根据Bean定义的配置元数据使用反射机制来创建Bean.在Spring Ioc 容器中主要有以下几种创建Bean实例的 ...

  3. Luogu P1377 [TJOI2011]树的序:离线nlogn建二叉搜索树

    题目链接:https://www.luogu.org/problemnew/show/P1377 题意: 有一棵n个节点的二叉搜索树. 给出它的插入序列,是一个1到n的排列. 问你使得树的形态相同的字 ...

  4. SpringMVC注解示例

    1.web.xml <servlet> <servlet-name>dispatcherServlet</servlet-name> <servlet-cla ...

  5. linux应用之make命令详解

    从源代码安装过软件的朋友一定对 ./configure && make && make install 安装三步曲非常熟悉了.然而究竟这个过程中的每一步幕后都发生了些什 ...

  6. Unity3D之Mesh(六)绘制扇形、扇面、环形

    前言: 绘制了圆,就想到绘制与之相关的几何图形,以便更灵活的掌握Mesh动态创建模型的机制与方法. 一.分析: 首先,结合绘制圆的过程绘制环形: 圆形是由segments个等腰三角形组成的(上一篇中, ...

  7. Mybatis_笔记_01_逆向工程

    通过Mybatis逆向工程,可以从数据库中的表自动生成pojo.mapper映射文件和mapper接口 此处暂存怎么使用逆向工程,原理以后再探讨 工程结构 要修改的地方:generatorConfig ...

  8. hdu5612 Baby Ming and Matrix games (dfs加暴力)

    Baby Ming and Matrix games Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Ja ...

  9. 【leetcode刷题笔记】ZigZag Conversion

    The string "PAYPALISHIRING" is written in a zigzag pattern on a given number of rows like ...

  10. (转载)[机器学习] Coursera ML笔记 - 监督学习(Supervised Learning) - Representation

    [机器学习] Coursera ML笔记 - 监督学习(Supervised Learning) - Representation http://blog.csdn.net/walilk/articl ...