- 博客(68)
- 收藏
- 关注
原创 VUE3+TS+VITE的一些经验总结
主要是一些和vue2版本差异较大的方面,持续更新中。配置资源路径,在env环境变量中设置VITE_PUBLIC_PATH = './'即可。 获取环境变量中定义的全局属性,获取环境用process.env.NODE_ENV,获取其他全局属性用import.meta.env.xxx。 获取页面跳转携带的查询参数,需要在页面组件中引用vue-router中的useRoute,通过useRoute的query属性获取。 import { useRoute } from 'vue-router'for
2022-05-25 17:45:44
1180
原创 JS数组合并的8种常见方法
1.ES6 解构[...arr, ...array]不改原数组值,生成新的数组。2.遍历添加array.forEach(item => { arr.push(item)})遍历方法:forEach、map、filter、every、for、for in、for of等。添加方法:push(后追加)、unshift(前追加)等。arr值改变成追加后的样子,array值不改变3.concatarr.concat(array)不改原数组值,生成新的..
2022-05-17 17:23:39
63197
原创 经典布局问题——两边定宽,中间自适应的6种布局方法
左右浮动float: left | right;对两边元素分别设置float为left、right。浮动元素后面记得清浮动,不然页面布局会混乱,兼容性好。绝对定位容器设置position为relative,内容均设置position为absolute,用left=0,left=firstContentWidth,right=0控制左中右位置。脱离文档流,兼容性较好。.container { position: relative;}.item { posit
2022-05-17 16:36:47
609
原创 localStorage、sessionStorage和cookie
cookie失效时间服务器设置默认到窗口关闭,localStorage不手动清除就一直在,sessionStorage在页面关闭时消失; 数据共享都遵循同源策略,sessionStorage还有同一页面的限制; cookie常用于存储登录验证信息,localStorage常用于存储改动少的数据减轻请求次数,sessionStorage常用于检测页面是否刷新; 前端给后端发送请求自动带cookie,可能浪费资源,storage不会自动带; cookie由服务器写入浏览器,storage由前端写入浏览器
2022-05-17 15:39:21
139
原创 js的事件轮循
执行过程普通的js代码是单线程同步执行的,从上到下的顺序。遇到异步代码,把异步代码交到其他线程处理,继续同步指定后续的单线程代码。异步代码分为宏任务和微任务,分别进入各自的等待队列。主线程代码执行完,开始检索执行微任务等待队列,完事检索执行宏任务等待队列。微任务宏任务都执行完,主线查询还有没有没执行的任务,给提到主线程上来执行。常见微任务process.nextTickPromiseMutationObserverObject.observe常见宏任务setTimeout
2022-05-17 15:21:10
246
原创 vue spa websockt 实现站内消息的发送和接收
几个基本的流程检查浏览器是否支持websocket,即判断'WebSocket' in window和'MozWebSocket' in window值是否为true,true就是浏览器支持websocket,这一步骤可以发生在mounted当中。 客户端与服务器建立连接。new WebSocket(url)即创建新的websocket实例,url为服务端提供,用来和服务器建立websocket连接。注意这个连接的过程中使用的协议不是http,https,而是ws协议。new WebSocket(ur
2020-11-13 10:16:09
1070
原创 js中可代替switch case的两种方法
普通的switch case代码普通的switch case代码替换方法1----Maplet playMap = new Map()playMap.set(1, '正常播放')playMap.set(2, '播放2分钟')playMap.set(3, '播放5分钟')playMap.set(5, '禁播')item.playType = playMap.get(parseInt(item.playType))? playMap.get(parseInt(item.playType
2020-09-02 11:01:54
3864
1
原创 区分[],{},‘‘,和false
JSON.stringify()用JSON.stringify()把要比较的内容都转成字符串,再进行相等比较===用‘===’代替‘==’比较Object.is()用Object.is()比较但注意Object.is([],[]) // false ; Object.is({},{}) // false
2020-08-05 10:45:38
309
原创 备份一些indexedDB的写法
mounted() { let request = window.indexedDB.open('tengxiTest', 1) let that = this request.onerror = function (e) { console.log('goes wrong') console.log(e) } re...
2020-06-18 15:07:35
527
1
原创 Array Flatten By Javascript
Note: doing test in vue cli 3.x enviromentMethod One: RecursionflatFunc (arr) { arr.forEach((item, index) => { if(item.length && item.length >= 0) { this.flatFunc(item) } else { this.emptyAr...
2020-05-19 16:07:40
114
原创 一个vue 项目常用的cdn资源
<!-- vue --> <script src="https://unpkg.com/vue@2.5.2/dist/vue.min.js"></script> <!-- vue router --> <script src="https://unpkg.com/vue-router@3.0.1/dist/vue...
2020-01-10 17:00:03
684
原创 vue多图片上传组件
<template> <div class="uploader-zone"> <el-row> <!-- 开始上传的按钮 --> <el-col :span="2"> <div class="mutiple-upload">...
2019-12-12 13:51:24
302
原创 node+socket+express实现多人聊天的聊天室
app.js中需要做的额外处理,开始使用socketvar server=require('http').createServer(app);var socket=require('socket.io')(server);var realServer = server.listen(3600, function () { var host = realServer.addres...
2019-12-10 12:00:43
349
原创 检查是不是回文数
回文数:1234321,12344321,一位的数不是回文数:1234673234,不为0且0结尾的数,负数方法一:通过内置函数判断,需要判断奇数位和偶数位的中间位置function checkPalindrome (data) { let midPos, firstHalf, secondHalf data = data + '' if(data.length == 1...
2019-12-05 13:17:59
249
原创 node js 实现桌面截屏
参考:https://www.npmjs.com/package/desktop-screenshot安装:npm idesktop-screenshot使用:var screenshot = require('desktop-screenshot')screenshot("./../screenshot.png", {width: 1920, height: 1080, qu...
2019-12-03 16:41:09
5010
1
原创 windows环境下安装rabbitmq教程
需要安装erlang和rabbitmqrabbitmq-server.bat // 启动服务的命令guest guest // 登录的用户名和密码'http://localhost:15672' // 浏览器中访问的地址安装教程地址 https://blog.csdn.net/zhm3023/article/details/82217222...
2019-12-03 15:33:07
104
原创 Promise 简洁应用模板
function pTest () { let pro = new Promise((resolve, reject) => { setTimeout(() => { resolve('谁知道是个什么玩意呢') }, 1000) }) return pro}function pTry () { let prom = new Promis...
2019-12-03 15:29:57
180
原创 node + mysql 爬取网页数据并写入数据库(Promise 优化,发邮件优化)
// 连接使用数据库import {connection} from './../../common/dbConnect.js'import {senderMsg} from './../../common/mailer.js'// 引入爬虫需要的网络请求模块const https = require('https')const fs = require('fs')// 需要被爬的...
2019-12-03 15:26:13
230
原创 interval in javascript
let count = 0let intervalFunc = function (word) { // 需要被周期性调用的函数 console.log(word) count += 1 console.log(count) if(count >= 10) { console.log('到了极限了') clearInterval(testInterval)...
2019-12-02 10:42:28
143
原创 node 错误信息写入log
// 打开指定文件并写入错误信息let writeLog = function (string) { fs.open(logPath, 'a', (err, fd) => { if(err) { throw err } else { fs.write(fd, string, (err, written, string) => { ...
2019-11-29 14:17:22
356
原创 node.js 发邮件
安装依赖nodemailer:npm install nodemailer -s配置发件终端:let senderMsg = nodemailer.createTransport({ host: 'smtp.qq.com', // qq邮箱的服务器 port: 465, // qq邮箱对应的端口 secureConnection: true, // 不写这句会报错:Greeti...
2019-11-29 13:29:16
480
原创 node + mysql 爬取网页数据并写入数据库
思路:1.从需要被爬的网站里获取数据2.依据获取到的数据结构(字段)创建数据库表结构3.创建数据表4.插入数据前整理数据5.将整理好的数据插入到数据库中6.插入操作结束后关闭数据库连接或者收集错误信息待优化部分:1.特殊字符(如表情符号)存入数据库中时会报错,需要优化编码方式2.错误信息可以通过邮件发给管理员3.优化同步异步操作,把好多层callback换成...
2019-11-28 16:33:44
563
原创 node.js 中对url的处理
const url = require('url')const URL = require('url').URLconst querystring = require('querystring')// console.log(url)// const myUrl = new URL('http://cmstest.cnlive.com:8768/witness/witnessTagList...
2019-11-27 10:28:57
280
1
原创 node.js 中的压缩与解压缩
const fs = require('fs')const zip = require('zlib')const gzip = zip.createGzip()const inFile = fs.createReadStream('./../in.txt')const outFile = fs.createWriteStream('./../outFounder.txt.gz')/...
2019-11-27 10:28:05
351
原创 node.js 中的console
const fs = require('fs')const { Console } = require('console')// 不需要引入console模块哦// console.log('普通的信息')// console.error(new Error('错误信息'))// console.warn('警告信息')// const output = fs.createWrit...
2019-11-27 10:26:13
393
原创 node.js 中的加密解密算法
const crypto = require('crypto')const fs = require('fs')// let secret_key = 'My name is Tengxi'// // 加密// const hash = crypto.createHmac('sha256', secret_key).update('Happy new Year').digest('hex...
2019-11-27 10:24:44
440
原创 mysql中的连接查询
实现情景:在多张表中查询数据并组合成新的查询结构连接分类:等值连接,左连接,右连接等值连接(内连接):INNER JOIN a表中的指定项和b表中的指定项符合指定的关系时(一般判断相等)查取a,b表中的若干指定项。左连接:LEFT JOIN 查取a表中所有记录,不管b表中有没有对应项。右连接:RIGHT JOIN 查取b表中所有记录,不管a表中有没有对应项。举例:app.g...
2019-11-26 16:28:56
93
原创 node + mysql 分页请求列表数据
// 获取列表数据 带分页app.get('/user', (req, res) => {// 获取分页参数,当前页码和每页数据量,没有的话给默认值 let curPage = req.query.curPage? req.query.curPage: 1 let pageSize = req.query.pageSize? req.query.pageSize: 10/...
2019-11-25 18:02:42
439
原创 mysql operation with node.js
Part One: Add data to databaseconst querystring = require("querystring")app.post('/useradd', (req, res) => { // 'useradd' is the name of this interface, 'post' is the method of this interface...
2019-11-25 15:47:47
98
原创 LIKE in mysql database
// LIKE 用在where字句中,可以用AND 和 OR 指定一个或者多个条件// 模糊查询// 如果 LIKE 后面的参数不加% 则和等号作用相同 即为精准查询// SELECT * FROM tmusic WHERE title LIKE '%一%'; // title中包含‘一’的记录// SELECT * FROM tmusic WHERE title LIKE '%一'; /...
2019-11-25 15:05:47
197
原创 true or false in js
// or 或运算,返回第一个真值,如果所有值都是假值,返回最后一个值// let orTest = 12 || false// console.log(orTest) // 12// let orTest1 = false || 45// console.log(orTest1) // 45// let orTest2 = undefined || false || null// c...
2019-11-19 11:57:53
91
原创 Symbol in js
// 对象的属性键只能是string类型和symbol类型// “Symbol”值代表用给定名称作为唯一标识// 存在系统级symbol// 用于区别对待对内操作和对外选择性输出// let id = Symbol('id')// let ids = Symbol('id')// console.log(id)// console.log(ids)// console.log(id...
2019-11-18 17:56:04
153
原创 try catch error in js
// try里面抛出异常,会在catch中捕获,刨,走catch,finally,不抛,走try和finally// Error异常对象// throw new Error('创造一个新的错误类型的错误信息', '文件名', '行号')// 系统异常:都是构造函数(包括基类Error)// EvalError:eval()函数没被正确执行// RangeError:范围错误//...
2019-11-18 14:56:40
118
原创 yield in js
// yield IE浏览器不兼容哦 但是IE edge兼容// 碰到yield就停止,生成yield对象,对象的value属性是yield后面的值function* yieldTest () { let array = [5, 4, 3] for (let i = 0; i < array.length; i++) { yield array[i] // yield使生...
2019-11-18 14:36:22
221
原创 js promise object
use strict'// 异步计算,队列化,类比callback// 都不是单纯的普通方法,都是promise对象才生效,对象可以保存状态,函数只有通过闭包才能保存状态// 异步操作的常见方法:回调和事件监听// 异步回调容易层次过深,可读性差,维护性差// 异步回调剥夺了return的能力// promise的三个状态:pending初始状态,fulfilled操作成功,rejec...
2019-11-15 17:16:54
1142
原创 js map
// 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值,不会改变原始数组// 方法按照原始数组元素顺序依次处理元素,不会对空数组检测,空数组返回[]// map中保存的是键值对,比较键的时候NaN和NaN是相等的,-0和+0是相等的,其他值遵循===标准let originArray = [4, 6, 3, 5, 2, 1]let anotherArray = [5, 23...
2019-11-15 13:33:26
190
原创 数组去重算法总结
const testArray = [{ label: 'Banana', color: 'yellow', taste: 'sweet', price: 4.38, hometown: 'Tailand', id: 5},{ label: 'Apple', color: 'red', taste: 'crisp', price: 3.99, hom...
2019-11-13 18:04:43
399
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人