javascript技巧

ES6中Set和Map数据结构的简单讲解

2022-08-19
目录 Set Map 总结 Set ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成 Set 数据结构. const s = new Set(); [2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x)); for (let i of s) { console.log(i); } // 2 3 5 4 上面代码通过add()方法向 Set 结构加入成员,结果表明 Set 结构不会添加重复的

解决uni-app微信小程序input输入框在底部时,键盘弹起页面整体上移问题

2022-08-18
目录 问题描述: 问题分析: 解决思路: 重点在这里!!!我踩坑被折磨很久的一个地方!!!一定要用 px!!! 总结: 问题描述: 最近的做了个客服聊天的功能,遇到一个问题如下:在手机上点击聊天页底部的input框后,键盘弹起同时页面会整体上移,标题栏被顶上去了.如下图: 问题分析: input 获取焦点时会自动调起手机键盘,设置 :adjust-position="true",会导致键盘弹起时页面整体上移 解决思路: 设置使键盘弹起使页面不上移 设置输入框所在盒子为绝对定位 键盘弹起

Rxjs 中处理错误和抓取错误的代码案例

2022-08-18
目录 场景 使用 try-catch 订阅中谁抓取错误 使用 Rxjs 的操作符 catchError throwError EMPTY 总结 使用 Rxjs,对于初学者来说,当我们处理 observables 错误的时候容易疑惑,因为我们会考虑使用 try-catch 方式捕获.但是,Rxjs 是通过操作符来管理错误. 我们通过代码案例一步步来了解.案例是使用 angular httpClient 模块来讲解,当然这适用于任何数据流. 场景 我们的应用中使用了一个服务,用来获取啤酒列表数据,然

微信小程序生命周期和WXS使用实例详解

2022-08-18
目录 引言 生命周期 生命周期分类 生命周期函数 生命周期函数分类 WXS wxs 和 JavaScript 的关系* 内嵌 wxs 脚本 外联 wxs 脚本 WXS特点 总结 引言 经过web前端开发的学习,相信大家对于前端开发有了一定深入的了解,今天我开设了微信小程序专栏,主要想从移动端开发方向进一步发展,而对于我来说写移动端博文的第一站就是小程序开发,希望看到我文章的朋友能对你有所帮助. 生命周期 生命周期(Life Cycle)是指一个对象从创建->运行->销毁的整个阶段,强调的是一个

three.js中正交与透视投影相机的实战应用指南

2022-08-18
目录 前言 1 正交投影相机 2 投射投影相机 3 实例 总结 前言 一个场景之所以会呈现在我们眼前是因为我们具有眼睛,眼睛提供了视觉.换句话说,如果three.js场景中没有这双眼睛,就像电影没有摄像机一样,场景就无法呈现在我们面前?这双眼睛就是相机,可见相机是Three.js场景中不可或缺的一个组件.Three.js库提供了两种不同的相机:正交投影相机和透视投影相机,接下来分别讲解这两种相机以及结合实例的应用. 1 正交投影相机 我们先来看一张示意图: 由图可知正交透视相机总共有6个面,其具

JSON.stringify(递归)与 JSON.parse(有限状态自动机)的实现代码

2022-08-17
JSON 的 stringify 和 parse 两个方法在平时的工作中也很常用,如果没有一些特殊的类型,是实现数据深拷贝的一个原生方式. 下面就这两个方法的一个手动实现思路. JSON.stringify JSON.stringify 方法用于将 JavaScript 值转换为 JSON 字符串.该方法有三个参数: data: 需要转换的数据 replacer:用于转换结果的对象或者数组,可以函数或者数组 space:文本添加缩进.空格和换行符,可以是数字或者字符串,数字的最大值是 10,字符

一文详解JavaScript 如何将 HTML 转成 Markdown

2022-08-17
目录 npm script 参数配置 前言: 本篇带来:在 JavaScript 如何将 HTML 转成 Markdown?先收藏,总有一天要用到!! npm 我们主要是借助 Turndown这个库来实现的 npm 安装 npm i turndown es6 import 引入: import TurndownService from 'turndown' CommonJs require 引入: const TurndownService = require('turndown'); 接下来我

JavaScript本地存储与会话存储的实现介绍

2022-08-16
目录 一.简单介绍 二.localStorage本地存储 三.sessionStorage会话存储 总结 一.简单介绍 本地存储和会话存储的目的,是将所输入的文件存入到浏览器中,在需要的时候,直接调用,但是本地存储和会话存储有着一定的区别,本地存储,在不主动删除的情况下,会一直保留在浏览器中,会话存储是,当前保存的内容,页面刷新还会保留在浏览器中,但是关闭页面在打开时,会发现没有数据了.这是他们两的用处和区别. 二.localStorage本地存储 如下代码 我们先给button一个监听事件,让

JavaScript getter setter金字塔​​​​​​​

2022-08-16
目录 引言 函数 getters setters getter-getters setter-setter iterables promises Observables GetterSetterFunctionValue async iterables operators 引言 英文链接: staltz.com/javascript-… 函数是JavaScript的基石. 它是一种灵活的.抽象的,可作为其他抽象的基础, 如:Promise.Iterables.Observables等. 之前我在

Mock.js的安装与使用教程(摆脱后端同学的束缚)

2022-08-16
目录 前言 Mock概述 mock.js安装 1.创建vue项目 2.项目中安装mock.js和axios 3.安装成功后我们运行项目 Mock规范 Mock的使用 总结 前言 当下采用前后端分离模式开发Web应用已经成为气候,在开发阶段有一个不成文的规定则是 项目开发后端先行 但是作为前端开发工程师的我们,难道在搭建完页面后只能等待后端的接口么?这样的话我们则完全被后端开发限制住了. 但其实我们只需要同后端同学商议决定好接口返回的数据格式我们就可以并行开发.很多同学则在开发中则会使用定义变量写

TypeScript对于Duck类型和模块命名空间应用

2022-08-16
目录 一.TypeScript 鸭子类型 二.TypeScript 命名空间 三.TypeScript 模块 四.类型脚本声明文件 一.TypeScript 鸭子类型 Duck类型是一种动态类型和多态形式.在这种风格中,对象的有效语义不是通过从特定类继承或实现特定接口来确定的,而是通过“当前方法和属性的集合”来确定的. var object_name = { key1: "value1", // 标量 key2: "value", key3: function()

一文彻底理解JavaScript原型与原型链

2022-08-15
目录 前言 new对函数做了什么? 原型和原型链 借用原型方法 实现构造函数之间的继承 方案一 方案二 class extends实现继承 结语 前言 JavaScript中有许多内置对象,如:Object, Math, Date等.我们通常会这样使用它们: // 创建一个JavaScript Date实例 const date = new Date(); // 调用getFullYear方法,返回日期对象对应的年份 date.getFullYear(); // 调用Date的now方法 //

微信小程序组件通信和behavior使用详解

2022-08-15
目录 引言

一文详解如何清除手机上小程序缓存

2022-08-15
目录 前言 一.提出问题: 二.分析问题: 三.解决问题: 总结 前言 原来真的有人,删掉手机里所有的娱乐软件,不管不顾任何东西,没日没夜的学习,就只是为了回到原来那个眼里有光被赋予希望的自己. 你要坚信每一个你想学习的念头,都是未来在向你求救! 懒惰是一个特别奇怪的东西, 它使你以为安逸是休息,是福气,它实际上给你带来了是无聊,是倦怠,是消沉,它剥夺你对前途的希望,隔断你和别人之间的友情,使你的心胸日益狭窄,对人生也越来越怀疑! 一.提出问题: 当小程序发布了新的版本后,用户如果之前访问过该小

JavaScript中 Promise 的使用技巧

2022-08-14
“生产代码”是可能需要一些时间来执行的代码. “消费代码”是必须等待结果的代码. Promise 是一个 JavaScript 对象,它链接生产代码和消费代码. 看一段最简单的代码: let myPromise = new Promise(function(myResolve, myReject) { // "Producing Code" (May take some time) myResolve(); // when successful myReject(); // when

使用typescript类型来实现快排详情

2022-08-14
目录 前言 元组快排 实现逻辑 实现数字的大小比较 实现 A 是否 小于或等于 B 实现 A 是否 大于或等于 B 实现Filter 优化Filter 重构数字的大小值比较 重构Filter 实现快排 测试快排 优化:负数 负数的判断 字符串转数字 获取负数的值 完善获取绝对值 重构数字的大小比较 重构快排 测试快排V2 前言 本文执行环境typescript,版本4.7.4 不使用typescript的计算能力,通过类型来实现快排 元组快排 能否将元组 [3, 1, 2, 4] 通过泛型转换成

uniapp实现附近商家定位的示例代码

2022-08-13
目录 一丶申请腾讯位置服务开发者密钥 二丶下载微信小程序JavaScriptSDK 三丶安全域名设置 四丶代码编写 4.1丶项目配置 4.2丶定义变量 4.3丶编写方法 4.4丶页面加载时调用 4.5丶数据展示 五丶真机调试效果图 有一个月没写博客了,最近在写项目,需要用到腾讯位置服务,获取附近商家位置.这里我就记录一下,实现过程. 一丶申请腾讯位置服务开发者密钥 申请地址:腾讯位置服务 - 立足生态,连接未来 官网教程:微信小程序JavaScript SDK | 腾讯位置服务  点击创建应用,

使用typescript推导已有变量的盲盒类型详情

2022-08-13
目录 迁移盲盒 类型推导 基础类型的推导 对象的推导 数组的推导 函数的推导 完善推导 测试 迁移盲盒 当我们从JavaScript一键转换Typescript的时候,any便是最省事的做法,对于维护并不友好(虽然能跑就行),同时每个变量对于我们来说都是盲盒,它到底是什么类型? 类型推导 基础类型的推导 基础数据类型的类型推导还是挺简单的 let a = 1; type A = typeof a; // number; let b = '2' type B = typeof b; // stri

关于ES6字符串的扩展详解

2022-08-13
目录 一.字符串的扩展 字符的 Unicode 表示法 字符串的遍历器接口 模板字符串 二.字符串的新增方法 includes(), startsWith(), endsWith() 实例方法:repeat() 实例方法:padStart(),padEnd() 实例方法:trimStart(),trimEnd() 总结 一.字符串的扩展 字符的 Unicode 表示法 ES6 加强了对 Unicode 的支持,允许采用\uxxxx形式表示一个字符,其中xxxx表示字符的 Unicode 码点.

Java SE 9 多版本兼容 JAR 包示例

2022-08-13
目录 说明 环境准备 命令行编译示例 Maven 项目配合多版本 Jar 示例 说明 Java 9 版本中增强了Jar 包多版本字节码文件格式支持,也就是说在同一个 Jar 包中我们可以包含多个 Java 版本的 class 文件,这样就能做到 Jar 包升级到新的 Java 版本时不用强迫使用方为了使用新 Jar 包而升级自己的业务模块 Java 版本,也不用针对不同最低支持 Java 版本提供不同的 Jar,真正的做到了一个 Jar 包兼容所有的目的. 本文通过以下示例来说明多版本 Jar