JS-定时器管理实例函数封装】的更多相关文章

知识点总结 函数封装 回调函数 实例:抖动函数 获取当前的位置 通过数组来实现,一正一负,直到恢复成0为止. 当前位置与数组中各值相加…
/** * Created by 12461 on 2016/11/6. */window.onload = function () { var oBtn1 = document.getElementById('btn1'); var oBtn2 = document.getElementById('btn2'); var oDiv = document.getElementById('div1'); //外面尽量不要放变量 // var timer = null; oDiv.timer = n…
一.了解 基本数据类型保存在栈内存中,按值访问,引用数据类型保存在堆内存中,按址访问. 二.浅拷贝 浅拷贝只是复制了指向某个对象的指针,而不是复制对象本身,新旧对象其实是同一内存地址的数据,修改其中一个值,另一个也会动态改变. 三.深拷贝 深拷贝是真正意义上实现了数组和对象的拷贝,它创建了另外一个一模一样的对象,和原对象不是一个内存地址,修改一个值不会影响另一个的值. 使用JSON.stringify()和JSON.parse()也可以实现深拷贝.当值为undefined.任意函数.symbol…
js节流与防抖函数封装 常见应用场景: window的 resize 和 scroll 事件: 文字输入时的 keyup 事件: 元素拖拽.移动时的 mousemove 事件: 防抖 定义:多次触发事件后,事件处理函数只执行一次,并且是在触发操作结束时执行 原理:对处理函数进行延时操作,若设定的延时到来之前,再次触发事件,则清除上一次的延时操作定时器,重新定时. 经典案例:百度输入内容自动搜索 /** *防抖函数 *@param fn 事件触发的操作 *@param delay 多少毫秒内连续触…
js里面的getElementsByClassName()方法可通过某个class名获取到元素,在标准浏览器下可使用,在非标准浏览器下不可用.为了能够让这个方法兼容所有的浏览器,可以封装成如下函数: function getElementsByClassName(ele,parent, classname) { //ele表示你要获取的元素,parent表示你要获取元素的父级元素,classname表示要获取的元素名 var aTarget = parent.getElementsByTagNa…
防抖 在监听scroll事件的时候经常会用到防抖,当滚动到某一位置而触发状态,从而不会出现频繁滚动持续触发事件的情况 防抖的事件处理机制仅触发一次且必须是结束状态下才会执行 function debounce(fun, delay) { let timer; return function() { timer && clearTimeout(timer); timer = setTimeout(function() { fun(); }, delay); } } window.addEve…
一.计算一段字符串的字节长度 字符串的charCodeAt()方法, 可返回字符串固定位置的字符的Unicode编码,这个返回值是0-65535之间的整数,如果值<=255时为英文,反之为中文. 而,中文的字节长度为2,英文的字节长度为1. 依照这个规律封装如下: function getStrBytes(str){ str = str.toString(); var strLen = 0; for (let s = 0; s < str.length; s++) { if(str.charC…
js节流与防抖函数封装 常见应用场景: window的 resize 和 scroll 事件: 文字输入时的 keyup 事件: 元素拖拽.移动时的 mousemove 事件: 防抖 定义:多次触发事件后,事件处理函数只执行一次,并且是在触发操作结束时执行 原理:对处理函数进行延时操作,若设定的延时到来之前,再次触发事件,则清除上一次的延时操作定时器,重新定时. 经典案例:百度输入内容自动搜索 /** *防抖函数 *@param fn 事件触发的操作 *@param delay 多少毫秒内连续触…
项目文件目录/src/api ajax.js /** * ajax 请求函数模块 * 返回值为promise对象 */ import axios from 'axios' export default function ajax (url, data = {}, type = 'GET') { return new Promise((resolve, reject) => { let promise if (type === 'GET') { // 准备url query 参数数据 let da…
前端总结系列 前端总结·基础篇·CSS(一)布局 前端总结·基础篇·CSS(二)视觉 前端总结·基础篇·CSS(三)补充 前端总结·基础篇·JS(一)原型.原型链.构造函数和字符串(String) 前端总结·基础篇·JS(二)数组深拷贝.去重以及字符串反序和数组(Array) 前端总结·基础篇·JS(三)arguments.callee.call.apply.bind及函数封装和构造函数 目录 一.函数使用 1.1 函数声明和函数表达式 1.2 函数封装(自调用函数.闭包) 1.3 函数属性(a…
在javascritp中,有两个关于定时器的专用函数,分别为: 1.倒计定时器:timename=setTimeout("function();",delaytime);2.循环定时器:timename=setInterval("function();",delaytime); 第一个参数“function()”是定时器触发时要执行的动作,可以是一个函数,也可以是几个函数,函数间用“:”隔开即可.比如要弹出两个警告窗口,便可将“function();”换成“aler…
在javascritp中,有两个关于定时器的专用函数. 分别为:1.倒计定时器:timename=setTimeout("function();",delaytime);2.循环定时器:timename=setInterval("function();",delaytime);第一个参数“function()”是定时器触发时要执行的动作,可以是一个函数,也可以是几个函数,函数间用“:”隔开即可.比如要弹出两个警告窗口,便可将“function();”换成“alert…
一.定时器中的this: 不管定时器中的函数怎么写,它里面的this都是window: 在函数前面讲this赋值给一个变量,函数内使用这个变量就可以改变this的指向 二.函数封装 函数封装是一种函数的功能,它把一个程序员写的一个或多个功能通过函数.类的方式封装起来,对外 只提供一个简单的函数接口,当程序员在写程序的过程中需要执行同样的操作时,程序员不需要写同样的函数来调用, 直接可以从函数库里调用…
1.request.js  函数封装 import { Toast } from 'antd-mobile'; import axios from 'axios'; import store from '../store'; import { push } from 'react-router-redux'; import qs from 'qs'; // 请求路径 const BaseUrl = 'https://www.baidu.com/'; // 主机及端口 //axios默认配置请求的…
本文实例讲述了JS中的回调函数.分享给大家供大家参考,具体如下: 在说回调函数之前,不妨先看一段代码,相信有点js基础的同学都能明白他的含义: ? 1 2 3 document.getElementById('demo').click=function(){   alert(1); }; 这段代码其实就是一段事件回调,这样写看的其实相对模糊一些,我们不妨看下接下来的代码 ? 1 2 3 document.getElementById('demo').addEventListener('click…
js cookie创建读取删除函数封装 一.总结 都是为了方便操作,这样弄了很方便 1.创建cookie的函数封装的作用:方便设置过期时间expire,方便设置键和值 2.查询cookie的数据封装的作用:document.cookie 获取的cookie是这样的:name1=aaa; name2=bbb; name3=ccc; 所以需要用split函数分割,先用:分割,然后用=等号分割 3.删除cookie的函数封装的作用:设置过期时间是位过去时间 二.js cookie创建读取删除函数封装…
js进阶ajax函数封装(匿名函数作为参数传递)(封装函数引入文件的方式非常好用) 一.总结 2.匿名函数作为参数传递 二.js进阶ajax函数封装 ajax1.js function ajax(url,funSucc,fnFaild){ //1.以函数作为函数的参数传进来 var xhr=new XMLHttpRequest(); xhr.open('GET',url,true); xhr.send(null); xhr.onreadystatechange=function(){ if (x…
js定时器关闭,一次关闭所有正在运行的定时器,自定义函数clearIntervals()一次关闭所有正在运行的定时器,原理:利用数组存储定时器id,然后遍历数组,关闭定时器 附上页面的截图,代码在截图下,想看效果就自己复制下边的代码,保存个页面看吧:…
1.为li标签添加index属性,这个属性正好就是span标签数组的index值 2.函数封装适合页面有多个tab切换,需要注意的在获取的li标签和span标签对象时,必须将对应div对象作为参数传入 li标签添加index属性 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <s…
JS定时器的用法及示例 目录 js 定时器的四个方法 示例一 示例二 示例三 js 定时器的四个方法 setInterval() :按照指定的周期(以毫秒计)来调用函数或计算表达式.方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭. setTimeout() :在指定的毫秒数后调用函数或计算表达式. clearTimeout(timer):取消由setTimeout()设置的定时操作. clearInterval(timer):取消由setInterval()设置的…
学习js,因为函数和定时器直接的关系是非绑定的.我不能说我开启一个定时,然后拿一个变量去记录这个setInterval的返回值,这样很麻烦. 本着面向对象的思想,利用业余时间(周末在家里)写了一个类,用来管理定时器. 吐槽下jQuery,不知道是不是我的jQuery版本太低,貌似jQuery没有提供很好的定时器管理类. 好废话不多说,上代码: function TimeControlEx() { var nCount = 0; var oTimerIDs = []; //ID,Name var…
C#保留2位小数几种场景总结   场景1: C#保留2位小数,.ToString("f2")确实可以,但是如果这个数字本来就小数点后面三位比如1.253,那么转化之后就会变成1.25.可不可以刚好保留到最后一位不是0的位置?默认保留2位,如果真的有3位小数,就保留3位,有4位就保留4位. 先说一下ToString("0.00##")中0和#的区别: 0 代表占位的.如果ToString("0.00") 这样就是保留两位小数,无论小数有多少位或者无…
jquery中ajax中post方法(多学习:洞悉原理,触类旁通)(函数封装思想) 一.总结 1.多看学习视频:洞悉原理,触类旁通, 2.函数封装:$.post(URL,data,callback);   这个函数就是赤裸裸的对ajax进行了函数封装 二.jquery中ajax中post方法 1.jquery中ajax主干 2.详解 jQuery $.post() 方法 $.post() 方法通过 HTTP POST 请求从服务器上请求数据. 语法: $.post(URL,data,callba…
变速动画函数封装 匀速动画:每次步数都是10 (var step=10;) 变速(缓动)动画:每次的步数是用当前位置和目标位置相减 var step=(target-current)/10; 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>title</title> <style>…
JS定时器是函数 setInterval(函数体/函数名  , 时间) 清楚定时器 clearInterval(函数) 时间单位(毫秒) 1000毫秒  = 1秒 首先我们要知道用JS定时器能干什么?定时器的原理是什么? 我的理解为,定时器是能让一个物体根据规定的时间做规定的移动,而物体运动是怎样的效果呢?你可以理解为一个人走路,要走到某个位置,要走到这个位置肯定是一步步移动才能达到,而不是瞬间就到达的,所以定时器的作用更像是让物体像人一样走到相应的位置 比如: 规定一个横形状方块,其中包裹一个…
PC 上的 Firefox.Chrome 和 Safari 等浏览器,都会自动把未激活页面中的 JavaScript 定时器(setTimeout.setInterval)间隔最小值改为 1 秒以上:而移动设备上的浏览器往往会直接冻结未激活页面上的所有定时器」.今天继续聊一聊 JavaScript 定时器与移动 Web 这个话题. 计时器 最简单的计时器只需要一个时间变量和固定间隔运行的函数就可以了,定期把上一次时间(默认为系统初始时间)加上运行间隔就是当前时间了.在 PC 上,这样实现的计时器…
一:js两种定义函数的方式及区别 1:函数声明: function sayA() { alert("i am A"); } 2:函数表达式: var sayB = function() { alert("i am B"); } 区别:code 前者会在代码执行之前提前加载到作用域中,后者则是在代码执行到那一行的时候才会有定义 二:js两种继承方式及区别 对象冒充 临时属性 call() apply() 原型链 code 继承应选哪种 code 三:实例 js两种定义…
Util.js (持续更新中...) 项目地址: https://github.com/dragonir/Util.js 项目描述 Util.js 是对常用函数的封装,方便在实际项目中使用,主要内容包含:数组类.浏览器类.日期类.函数类.数学类.媒体类.节点类.对象类.字符串类.类型检测类.正则表达式类等内容. 使用方法 1. 引入Bable transpiler以保证支持ES6 <script type="javascript/text" src="./browser…
稳定性: 5 - 锁定 所有的定时器函数都是全局的.不需要通过 require() 就可以访问. setTimeout(callback, delay[, arg][, ...]) delay 毫秒之后执行 callback.返回 timeoutObject 对象,可能会用来 clearTimeout().你也可以给回调函数传参数. 需要注意,你的回调函数可能不会非常准确的在 delay 毫秒后执行,Node.js 不保证回调函数的精确时间和执行顺序.回调函数会尽量的靠近指定的时间. clear…
1.软件定时器管理 uC/OS-III提供了软件定时器服务(相关代码在OS_TMR.C中).当设置OS_CFG.H中的OS_CFG_TMR_EN为1时软件定时器服务被使能. 2.uC/OS-III 定时器的分辨率决定于时基频率,也就是变量OS_CFG_TMR_TASK_RATE_HZ的值,它是以 Hz为单位的.如果时基任务的频率设置为 10Hz,所有定时器的分辨率为十分之一秒.事实上, 这是用于定时器的推荐值. 定时器用于不精确时间尺度的任务. 3.uC/OS-III提供了一些函数用于管理定时器…