返回顶部
首页 > 资讯 > 精选 >微信小程序实战中如何使用类优化程序结构
  • 713
分享到

微信小程序实战中如何使用类优化程序结构

2023-06-19 10:06:55 713人浏览 安东尼
摘要

本篇文章为大家展示了微信小程序实战中如何使用类优化程序结构,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。虽然javascript是一种脚本语言,但是依然可以定义和使用类。在这个小程序中,将监控点相关

本篇文章为大家展示了微信小程序实战中如何使用类优化程序结构,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。

虽然javascript是一种脚本语言,但是依然可以定义和使用类。在这个小程序中,将监控点相关的功能做成了一个类。

alarm.js

//alarm.js:

const util = require('./util.js')

const CHECK_BUFFER_SIZE = 3

//构造函数

function Alarm(data){

 this.latitude = data.latitude

 this.longitude = data.longitude

 this.state = data.state

 this.checkBuffer = []

 this.title = data.title

 this.monitor_type = data.monitor_type

 this.action_type = data.action_type

 this.meaia_url = data.media_url

 this.timer = data.timer

}

//定义原型

Alarm.prototype ={

 constructor:Alarm,

 setTitle: function (t) {

   this.title = t

 },

 setMonitorType:function(m_type){

   this.monitor_type = m_type

 },

 setActionType: function (a_type) {

   this.action_type = a_type

 },

 setMedia: function (url) {

   this.media_url = url

 },

 setTimer: function(t_name) {

   this.timer = t_name

 },

 checkLocation: function (latitude, longitude, accuracy) {

   const app = getApp()

   var that = this;

   var distance = util.getDistance(this.latitude, this.longitude, latitude, longitude)

   app.addLog(distance + "," + accuracy)

   if (distance < accuracy) {

     this.checkBuffer.push(1)

   } else {

     this.checkBuffer.push(-1)

   }

   if (this.checkBuffer.length > CHECK_BUFFER_SIZE) {

     this.checkBuffer.shift()

   }

   var sum = 0;

   that.checkBuffer.forEach(function (value) {sum += value})

   if (this.moitor_type == '接近监控点') {

     if (this.state == 'new') {

       if (sum == -CHECK_BUFFER_SIZE) {

         this.state = 'armed'

       }

     } else if (this.state == 'armed') {

       if (sum == CHECK_BUFFER_SIZE) {

         this.state = 'fired'

       }

     }

   } else {

     if (this.state == 'new') {

       if (sum == CHECK_BUFFER_SIZE) {

         this.state = 'armed'

       }

     } else if (this.state == 'armed') {

       if (sum == -CHECK_BUFFER_SIZE) {

         this.state = 'fired'

       }

     }

   }

 },

 excueteAction: function () {

   play.playVoice(this.media_url)

 },

};

module.exports = {

 Alarm:Alarm,

}

代码说明

在alarm.js中,定义了一个名为Alarm的类。

首先定义了一个Alarm构造函数,它以一个对象data作为参数,函数的功能就是从data中取出数据并设定到相应的数据成员上。

接下来定义了一个prototype对象,它的内部又定义了若干函数。所有通过new Alarm获得的对象都以protype中定义的内容作为原型。换言之就是都可以使用prototype中定义的函数。

最后的module.export语句定义的本模块对外公开的功能。

函数的内容我们在后续文章中说明。

类的使用

导入类

首先需要在利用者模块中导入Alarm类。与Alarm.js中的module.export相对应,可以使用以下的方式:

import { Alarm } from './utils/alarm.js'

创建对象,使用对象

var alarm = new Alarm({latitude:38,longitude:120})

alarm.setActionType("播放提示音")

代码下载链接

alarm.js

https://raw.GitHubusercontent.com/xueweiguo/alarmmap/master/utils/alarm.js

上述内容就是微信小程序实战中如何使用类优化程序结构,你们学到知识或技能了吗?如果还想学到更多技能或者丰富自己的知识储备,欢迎关注编程网精选频道。

--结束END--

本文标题: 微信小程序实战中如何使用类优化程序结构

本文链接: https://lsjlt.com/news/295536.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • 微信小程序实战中如何使用类优化程序结构
    本篇文章为大家展示了微信小程序实战中如何使用类优化程序结构,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。虽然Javascript是一种脚本语言,但是依然可以定义和使用类。在这个小程序中,将监控点相关...
    99+
    2023-06-19
  • 如何优化微信小程序
    小编给大家分享一下如何优化微信小程序,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!避免使用本地大图片、大资源文件请避免在小程序的...
    99+
    2024-04-02
  • 【微信小程序】小程序基本组成结构
    前言 「作者主页」:雪碧有白泡泡 「个人网站」:雪碧的个人网站 「推荐专栏」: ★java一站式服务 ★ ★前端炫酷代码分享 ★ ★ uniapp-从构建到提升★ ★ 从0到英雄,vue成神之路★ ★ 解决算法,一个专栏就够了★ ★...
    99+
    2023-08-16
    小程序 微信小程序 notepad++
  • 微信小程序性能如何优化
    这篇文章主要介绍了微信小程序性能如何优化的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇微信小程序性能如何优化文章都会有所收获,下面我们一起来看看吧。为什么要做性能优化?一切性能优化都是为了体验优化1. 使用小程...
    99+
    2023-06-26
  • 微信小程序怎么优化
    这篇文章主要介绍了微信小程序怎么优化,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。页面跳转优先采用navigator组件小程序提供了两种页面路由方式:a. navigator...
    99+
    2023-06-20
  • 微信小程序中如何使用wx.previewImage
    这篇文章主要为大家展示了微信小程序中如何使用wx.previewImage,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带大家一起来研究并学习一下“微信小程序中如何使用wx.previewImage”这篇文章吧。预览图片。O...
    99+
    2023-06-26
  • 如何优化PHP开发的微信小程序?
    如何优化PHP开发的微信小程序?随着微信小程序的普及,越来越多的开发者开始关注如何优化微信小程序的开发。在开发中,PHP是一种常用的后端语言,它提供了丰富的功能和严密的安全性。下面将介绍一些优化的方法和具体代码示例,以帮助开发者更好地使用P...
    99+
    2023-10-27
    优化 微信小程序 PHP开发
  • 微信小程序怎么做优化
    微信小程序可以从这几方面优化:1.样式优化,小程序整体风格统一;2.布局优化,小程序各版块要有逻辑;3.搜索优化,标题使用行业关键词;4.使用优化,针对页面反应速度及导航设置进行优化;微信小程序可以从以下几方面来优化样式优化小程序整体风格样...
    99+
    2024-04-02
  • 微信小程序TodoList如何使用
    这篇文章主要介绍“微信小程序TodoList如何使用”,在日常操作中,相信很多人在微信小程序TodoList如何使用问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”微信小程序TodoList如何使用”的疑惑有所...
    99+
    2023-06-26
  • 微信小程序中怎么优化性能
    微信小程序的性能优化可以从多个方面入手,以下是一些优化性能的方法: 减少页面的渲染元素和层数:尽量减少页面中的元素数量和嵌套层数...
    99+
    2024-04-09
    微信小程序
  • 如何在微信小程序中使用echart
    如何在微信小程序中使用echart?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。首先到ECharts官网下载我放的是tool文件夹下面,你们随意引入的时候注意路径就行2.使...
    99+
    2023-06-15
  • 微信小程序中match-media如何使用
    这篇文章主要介绍了微信小程序中match-media如何使用,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。match-mediamedia query 匹配检测节点。可以指定...
    99+
    2023-06-26
  • echart在微信小程序中如何使用
    今天小编给大家分享一下echart在微信小程序中如何使用的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。echarts不显示在...
    99+
    2023-07-05
  • 微信小程序中使用table
    ...
    99+
    2023-08-16
    微信小程序 小程序 table
  • 微信小程序中如何实现微信支付
    微信支付是微信公众平台提供的一种在线支付服务,可以为用户提供快速、方便、安全的支付体验。而在微信小程序中实现微信支付,则可以为应用程序提供更多的功能和服务,提高用户体验和商业价值。因此,在本文中,我们将介绍如何在微信小程序中实现微信支付。 ...
    99+
    2023-08-16
    微信小程序 微信 小程序 前端 javascript
  • 微信小程序的canvas如何使用
    这篇文章主要介绍了微信小程序的canvas如何使用的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇微信小程序的canvas如何使用文章都会有所收获,下面我们一起来看看吧。canv...
    99+
    2024-04-02
  • 如何才能使用微信小程序
    这篇“如何才能使用微信小程序”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“如何才能使用微信小程序”文章吧。  第一步:填写账...
    99+
    2023-06-26
  • 微信小程序开发中如何使用wx.vibrateLong
    这篇“微信小程序开发中如何使用wx.vibrateLong”文章,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要参考一下,对于“微信小程序开发中如何使用wx.vibrateLong”,小编整理了以下知识点,请大家跟着...
    99+
    2023-06-26
  • 微信小程序组件化开发的实战步骤
    目录前言项目需求一般方式开发自定义组件开发总结前言 本来没打算写这篇文章,因为自己主要在搞Java相关的,前端的仅仅是使用。但是最近由于开发人手不够,一个人被迫开启全栈,一边写接口一...
    99+
    2024-04-02
  • 【小程序】微信小程序如何获取微信公众号openid?
    一图总览 大家可以先看看下面的流程图,来了解笔者想实现的功能,简单来说就是两个不同主体间的小程序与公众号该如何产生关联。 注:为什么这里要强调不同主体呢,因为同主体的小程序与公众号是可以通过unionId来进行关联绑定。 ...
    99+
    2023-08-19
    微信小程序 小程序 微信
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作