JavaScript设计模式策略模式案例分享

前言策略设计模式就是指一个问题匹配多个解决方法,不一定要用到哪一个,而且有可能随时增加多个方案比如我们去买书,书店都会搞一些优惠活动,满100减20,满200减50,八折优惠这些,但是...

JavaScript手写Promise核心原理

目录准备完善 resolve/rejectthen异步处理链式调用边界处理catch优化后完整代码准备首先,promise 有三种状态:pending fulfilled rejected;promise在实例化操作中, 有两个改变...

详解JavaScript什么情况下不建议使用箭头函数

目录this指向原理问题的由来内存的数据结构函数环境变量箭头函数的缺点不适用的场景总结箭头函数作为ES6新增的语法,在使用时不仅能使得代码更加简洁,而且在某些场景避免this...

JavaScript中arguments.callee属性的作用与替换方案

arguments.callee的作用在函数内部,有两个特殊的对象:arguments 和 this。其中, arguments 的主要用途是保存函数参数, 但这个对象还有一个名叫 callee 的属性,该属性是一个指针,...

小程序实现轮播图

本文实例为大家分享了小程序实现轮播图的具体代码,供大家参考,具体内容如下那个先上效果:step1:页面index.wxml代码<!-- 轮播 --><swiper class='u-wrp-bnr' indicator-dots='t...

微信小程序实现轮播图标题跑马灯

本文实例为大家分享了微信小程序实现轮播图标题跑马灯的具体代码,供大家参考,具体内容如下微信小程序做轮播图,轮播图下的标题如果不长不需要跑马灯效果,过长的无法显示全的则添...

使用JS实现一个Sleep函数的示例代码

目录前言1.目标分析2.setTimeout 封装3.Promise 封装4.async/await总结前言我们都是 JavaScript 是一个单线程语言,单线程有它的好处也有它的坏处。在我们熟知的如 Java、C++...

解决window.open()被浏览器拦截的问题

一、问题描述最近在做项目的时候碰到了使用window.open被浏览器拦截的情况,虽然在自己的环境可以对页面进行放行,但是对用户来说,不能要求用户都来通过拦截。何况当出现拦截时,...

JavaScript手写call,apply,bind方法

目录前言改写this实现思路前期准备手写call方法手写apply方法手写bind方法前言改变this指向在书写业务的时候经常遇到,我们经常采用以下方法进行改写使用作用声明变量存储thi...

基于JavaScript绘制动态花束的示例代码

目录演示技术栈源码cssjs演示技术栈这次用到了一个名叫p5.js的框架:p5.js 是一个JavaScript的函数库,它在制作之初就和Processing有同样的目标。就是让艺术家,设计师,教育工作者...

微信小程序开发实现轮播图

小程序,移动端离不开轮播图的功能,下面就写一个小程序的轮播图功能分享给大家效果图:1.页面代码<!--index.wxml--><view class="container">    <!--轮播图-->  <swiper cla...

微信小程序如何实现列表渲染和条件渲染

目录概述:循环渲染:渲染目标是列表时:渲染目标为字典时:总结概述:要实现列表渲染我们首先要介绍一下< block标签.该标签不会再列表中做任何渲染,一般当做容器使用.我们可以...

小程序模实现糊搜索功能

本文实例为大家分享了小程序模实现糊搜索功能的具体代码,供大家参考,具体内容如下1.写好页面布局<!--搜索--><view class="searchbox">  <form bindsubmit="formSubmit"> ...

微信小程序实现轮播图指示器

本文实例为大家分享了微信小程序实现轮播图指示器的具体代码,供大家参考,具体内容如下1.文件目录2.轮播图页面布局需求:自定义轮播指示器:当轮播图发生变化时,自定义轮播指示器跟...

基于JS实现二维码名片生成的示例代码

目录演示技术栈源码cssjs演示技术栈这里用到了一个二维码生成库qrcode.js下面是简单介绍://初始化QRCode对象var qrcode = new QRCode(document.getElementById("qrcode"));...

深入学习JavaScript中的promise

目录为什么要用Promise?使用Promise解决异步控制问题Promise的结构回调函数为什么异步代码一定是回调函数结构?刨析Promise原型方法——catch\finally\then为什么要...

小程序实现轮播每次显示三条数据

本文实例为大家分享了小程序轮播每次显示三条数据的具体代码,供大家参考,具体内容如下1.页面布局<!-- 统计过程控制s -->              <view class='Lean_item'>   ...

ArrayBuffer Uint8Array Blob与文本字符相互转换示例

目录API介绍字符与ArrayBuffer,Uint8Array相互转换API介绍前端 File 上传、下载,Canvas 保存图片,Ajax 和 Fetch 二进制流传输,PDF 预览,浏览器上 WebAssembly 的应用 等等都需要...

JavaScript大文件上传的处理方法之切片上传

目录前言切片后上传生成hash文件秒传暂停上传中断请求示例添加暂停上传功能恢复上传添加功能总结前言本篇介绍了切片上传的基本实现方式(前端),以及实现切片上传后的一些附加功...

js使弹层下面的body禁止滚动

弹窗是一种常见的交互方式,而蒙层是弹窗必不可少的元素,用于隔断页面与弹窗区块,暂时阻断页面的交互。但是,在蒙层元素中滑动的时候,滑到内容的尽头时,再继续滑动,蒙层底部的页面会...

JavaScript文件上传的常见问题整理

文件上传:<input type="file" /> (IE9及以下不支持下面这些功能,其它浏览器最新版本均已支持。)1、允许上传文件数量允许选择多个文件:<input type="file" multiple>只允许上传一...

使用webpack打包ts代码的实现

目录使用 webpack 打包生成 package.json安装 cnpm安装 webpack 相关编写 webpack 配置文件创建 tsconfig.json修改 package.json使用webpack打包安装插件html-webpack-plug...

TypeScript在Vuex4中使用TS实战分享

目录简介createStoreGetterTreeMutationTreeActionTreeModuleTree实战整体目录结构首先定义根state的类型在创建store的时候将根state的类型传递进去。并且需要导出key在Vue...

TypeScript合并两个排序链表的方法详解

目录前言思路分析实现代码测试用例示例代码前言给定两个递增排序的链表,如何将这两个链表合并?合并后的链表依然按照递增排序。本文就跟大家分享一种解决方案思路分析经过前面...

详解JavaScript如何准确获取任意变量的数据类型

目录判断类型常用的方法typeofinstanceoftoString封装一个获取类型的函数typeof + instanceof(不推荐)toString总结js是弱类型语言,或者说是动态语言,在定义变量时我们可以不提...

Rxjs TakeUntil 操作符内容梳理总结

TakeUntil 的官方文档对这个操作符的解释是:Emit values until provided observable emits.即它可以被赋予另一个起锚定作用的 Observable,当该锚定 Observable emit 值时,原始...

基于JS实现简单的3D立方体自动旋转

目录演示技术栈源码cssjs雪花部分演示技术栈display:inline-block,block,inline元素的区别:display:block将元素显示为块级元素,从而可以更好地操控元素的宽高,以及内外边距,每一...

微信小程序之五种页面跳转方法小结

目录第一种:<navigator></navigator>标签.第二种:wx.navigateTo.第三种:wx.redirectTo.第四种:wx.switchTab.第五种:wx.reLaunch.第一种:<navigator></navigator>标签.这是...

教你如何使用 JavaScript 读取文件

目录使用 JavaScript 读取文件概述选择带有输入元素的文件处理输入元素的变化事件从输入元素的 files 属性中获取一个 File 对象使用 FileReader 读取 File 对象读取文件示...

利用JavaScript实现3D可旋转粒子矩阵效果

目录演示技术栈dat.gui.min.js源码js部分演示技术栈本次使用了dat.gui.min.js这个新库(就是在我文章里没有出现过的那么他们的功能有哪些呢?——可以百度搜搜)不想搜...

关于layui的按钮禁用与恢复方式

目录layui的按钮禁用与恢复禁用按钮状态恢复按钮状态layui中基本元素之按钮按钮用法主题尺寸圆角图标按钮组按钮容器layui的按钮禁用与恢复禁用按钮状态$('#sendSmsBtn').ad...

JavaScript的11个小技巧整理

目录1、过滤唯一值2、短路求值(Short-Circuit Evaluation)工作原理场景举例3、转换Boolean型4、转换String型5、转换Number类型6、快速求幂7、快速Float转Integer使用场景8、...

使用clipboard.js库实现复制剪切功能

项目地址:https://github.com/zenorocha/clipboard.js现代化的“复制到剪切板”插件。不包含 Flash。gzip 压缩后仅 3kb。为什么使用它复制文字到剪切板不应该很难...

实用的Javascript调试技巧整理

目录1. 不要使用alert2. 学会使用console.log3. 学会使用console.dir4. 学会使用console.table5. 学会使用console.time6. 使用debugger打断点7. 查到源码文件8. 压缩JS文件...

TypeScript利用TS封装Axios实战

目录简介Axios几个常用类型AxiosRequestConfigAxiosInstanceAxiosStaticAxiosResponseAxiosError基础封装拦截器封装常用方法封装总结简介这是TypeScript实战的第三篇文章。...

使用 Angular 服务器端渲染 Transfer State Service

假设我们使用 Angular Universal 开发一个服务器端渲染的 Angular 应用,这个应用会消费一个第三方的 Restful API.上述场景分为下列六个步骤:用户向部署了 Angular 服务器端应...

JavaScript稀疏数组与孔hole示例详解

目录稀疏数组是什么JavaScript数组天生就是稀疏数组JavaScript数组稀疏特性带来的“怪异现象”slice会复制孔forEach、every会跳过孔(不对孔调用回调函数)map不对孔...

js实现数组转树示例

目录原生 封装工具函数 getTree结构图:原生 封装工具函数 getTree1.1 定义-映射对象 map数组 treeList=[]1.2 遍历后端返回的数组 list 为 每个数组对象item 添加 children...

JavsScript中Promise的错误捕获详解

目录我们需要在异步任务中准确的进行错误捕获,以便我们可以知道错误出在什么地方我们再讨论then方法中的第二个参数和Promise.catch方法的区别题: then方法的连续调用,怎么能够...

深入浅出JS的Object.defineProperty()

目录前言对象的定义与赋值Object.defineProperty()语法说明属性的特性以及内部属性属性描述符数据描述符 --特有的两个属性(value,writable)存取描述符 --是由一对 getter、se...

如何利用JS实现时间轴动画效果

目录css动画什么是时间轴动画?动画对象动画函数思考总结css动画在前端开发中,一些简单的动效往往是使用 css3 的 @keyframes 来实现的 ,如:.div1 { width: 100px; height:...

layui中的tab控件点击切换触发事件

目录tab控件点击切换触发事件方法一方法二layui选项卡无法切换解决tab控件点击切换触发事件在layui中使用到tab控件,如果不想在页面加载时就加载所有tab的界面,而是点击某个ta...

JS异步编程Promise对象详解

1、单线程模型单线程模型指的是,JavaScript 只在一个线程上运行。也就是说,JavaScript 同时只能执行一个任务,其他任务都必须在后面排队等待。注意,JavaScript 只在一个线程上运...

JavaScript简写技巧总结

目录1. 空(null, undefined)验证2. 数组3.if true .. else 的优化4.变量声明5.赋值语句的简化6.避免使用RegExp对象7.If 条件优化8.charAt()的替代品在日常工作中,JavaScript...

深入了解JavaScript中递归的理解与实现

目录前言递归的基本理解实例解析求斐波那契数时间复杂度分析空间复杂度分析执行顺序分析前言我们在写业务代码的时候,或多或少都会遇到需要使用递归的场景,比如在遍历树形结构...

JS Angular 服务器端渲染应用设置渲染超时时间​​​​​​​

我们用 setTimeout 模拟一个需要 5 秒钟才能完成调用的 API:const express = require('express');const app = express();app.get('/api/fast', (req, res) => { console.lo...

Angular 服务器端渲染缓存功能问题

关于通过 Angular Universal 渲染出的页面源代码,我们有两种缓存方式:HTTP cache使用网络缓存时,一切都是为了在服务器上设置正确的响应标头。 它们指定缓存生存期和缓存策略。...

使用window.postMessage()方法在两个网页间传递数据

目录说明发送端postMessage程序发送消息的基本语法:targetWindowmessagetargetOrigintransfer接收端完整程序发送程序接收程序说明window.postMessage()方法可以安全地实现Wi...

基于Cesium实现卫星在轨绕行动画

目录资源网站绘制卫星绕轨动效初始化蓝星添加卫星模型方法相关方法这个效果其实网上很多案例了,本来不打算写了,但是做都做了,稍微来说一下吧,代码实测可用!最后的效果就是这个样...

JavaScript实现LRU缓存的三种方式详解

目录分析使用Map实现LRU缓存使用Object + Array实现LRU缓存使用双向链表实现LRU总结LRU全称为Least Recently Used,即最近使用的。针对的是在有限的内存空间内,只缓存最近使用...

返回顶部
顶部