个人学习测试

34个 JavaScript 简写优化技术你可能做了很长时间的 JavaScript 开发，但有时你可能没有更新最新的特性，这些特性可以解决你的问题，而不需要做或编写一些额外的代码。这些技术可以帮助您编写干净和优化的 JavaScript 代码。此外，这些主题可以为你接下来面试做准备。 1. 如果有多个条件我们可以在数组中存储多个值，并且可以使用数组includes方法。 // Longhandif (x === "abc" || x === "def" || x === "ghi" || x === "jkl") { //logic}// Shorthandif (["abc", "def", "ghi", "jkl"].includes(x)) { // logic} 2. 如果为真…否则简写这对于我们有if-else条件，里面不包含更大的逻辑时，是一个较大的捷径。我们可以简单的 ...

微信小程序选择图片并上传图床 选择图片我们选择wx.chooseMedia，曾经的wx.chooseImage已经停止维护了，所以使用wx.chooseMedia 代替。 上传图片我们选择wx.uploadFile，这是最优的方案，如果使用wx.request会非常非常非常麻烦！ 图床我这里以 Lsky 兰空图床为例，是在我自己的服务器上搭建的。 图床接口 wx.chooseMedia 的基本用法wx.chooseMedia({ count: 1, // 最多可以选择的图片张数，默认9 sizeType: ['original', 'compressed'], // original 原图，compressed 压缩图，默认二者都有 sourceType: ['album', 'camera'], // album 从相册选图，camera 使用相机，默认二者都有 success: res => { const filePa ...

react-codemirror2 踩坑之onChange事件导致重渲染背景：const [submittingCode, setSubmittingCode] = useState('');const submit = async () => { // 提交代码，提交的是submittingCode};return ( <CodeMirror value={submittingCode} options={{ ... }} onChange={(editor, data, value) => { setSubmittingCode(value) }} /> <button onClick={() => submit}> 提交代码 ...

进入远程服务器，做两步操作 本地Navicat做如下操作

JavaScript 实现一行代码将变量复制到剪切板用原生JavaScript的Promise风格实现一行代码将一个变量复制到剪切板。MDN上是这么写的：https://developer.mozilla.org/zh-CN/docs/Web/API/Clipboard/writeText 网上大部分方法是创建一个中间人（隐藏的input框），然后remove掉，很麻烦！并且现在其中的document.execCommand方法已经被==弃用==了，那么还不用下面这个方法？？别犹豫了！！ navigator.clipboard.writeText("被复制的文本").then(function() { /* 复制成功 */}, function() { /* 复制失败 */});

微信小程序bindtap事件绑定莫名其妙报错错误代码：Component “components/noteCard/index” does not have a method “checkDetails” to handle event “tap”. <view bindtap="checkDetails" class="evaluate btn">查看详情</view> const app = getApp()Page({ data: {} addNote() { wx.navigateTo({ url: `/pages/addNote/index`, }) }}) 这个bindtap看起来完全没问题，但是就是无法实现跳转且报警告，解决方法如下：把本地设置中的“将JS编译成ES5”取消勾选再勾选回去就行，具体原因未知。

在React中应用TS初始化一个React项目+TS 可以使用npm命令 利用npx的特性 $ npx create-react-app react-ts --template typescript 解释： npx create-react-app react-ts（项目名） –template typescript VSCode打开项目 Vuetur + eslint 校验vue项目 假设没有用umi脚手架，用prettier插件就可以配置自动保存就行了 npm或者yarn一定要配置淘宝镜像，否则会很慢 创建的新项目，没有js文件，都是ts文件，原来的jsx编程了tsx tsx表示在项目中需要用到react组件，JSX语法，需要使用TypeScript，必须使用tsx结尾 如果没有JSX语法，用ts结尾 useState当遇到never类型时，表示此类型不能用，不能通过该类型来解释当下的运行环境，必须指明类型 const [count, setCount] = useState(0)const [count, setCount] = useState<number& ...

JS一行代码实现二维数组的声明与初始化（3种方法）第一种：==强烈不推荐使用！！实际应用中存在致命问题！！！！== Array.fill() 嵌套方法致命问题看这里：JavaScript 踩坑 —— 使用 Array.fill( ) 填充对象导致的重大问题 const row = 5, col = 3 // 5行3列let arr1 = Array(row).fill(Array(col).fill('要填充的值'))console.log('arr1: ', arr1) 第二种：==强烈推荐！！== 其中item可以替换为任意临时变量，也可也是小括号对()先看看基础用法，是这样的： Array.from([1, 2, 3], x => x + x); 结果是[2, 4, 6]看懂了上面这句再看下面这句就明白了。 const row = 5, col = 3 // 5行3列let arr2 = Array.from(Array(row), item => new Array(col).fill('要填充的值 ...

JavaScript创建二维数组时尽量不要使用Array.fill( )的嵌套方式 当我们想使用 Array.fill( ) 来填充一个全是对象的数组时需要特别注意Array(size).fill({ }) 这样填充创建的数组，里面每一项{ }是完全相同的 问题是这样发现的~const row = 5, col = 3 // 5行3列let arr1 = Array(row).fill(Array(col).fill(0))let arr2 = Array.from(Array(row), item => new Array(col).fill(0))arr1[1][1] = 1arr2[1][1] = 1console.log('arr1 修改后', arr1);console.log('arr2 修改后', arr2); 执行上述代码时发现，用Array.fill()来向一个数组中填充若干个数组来创建二维数组，然后更改其中一个值时，那一列的所有值都发生了改变，于是引发了我的思考！！ 然后就有了下面的测试语句： const size ...

保姆级纯净的WIN10电脑安装+配置nodejs & 安装vue-cli 首先下载node.js地址：https://nodejs.org/en/1、下载安装包，点击安装就一直下一步就可以了。 2、安装完成后，系统会自动帮你配置系统环境变量，你可以在系统环境变量中path可以看到 3、win+r 进入cmd 查看node.js和npm的版本号，如下图：4、进入C:\Users\admin\AppData\Roaming，可以看到npm的本地仓库跑在系统盘c盘的用户目录了(没见到npm-cache是因为没有用过， 一使用缓存目录就生成了)，我们试图把这2个目录移动回到D:\ProgramFiles\nodejs，在D:\ProgramFiles\nodejs目录下创建两个文件夹，分别是以下两个:（==这里注意！！！== 有的人电脑是Program Files，有的人是ProgramFiles，区别在于中间的空格，不同电脑不一样，这里注意一下，一会儿会有影响，按照自己的情况就行）然后在docs命令下运行以下2条命令npm config set prefix “D:\ProgramF ...