js
代码执行
暴露在脚本块中的程序，在页面打开的时候执行，
并且遵守自上而下的顺序依次逐行执行，（这个代码的执行不需要事件）
引入外部独立的js文件的时候，js文件中的内容，会遵循自上而下的方式依次逐行执行
概念
全局变量：
在函数体之外的声明变量属于全局变量，全局变量的声明周期是:
浏览器打开时声明，浏览器关闭时销毁，尽量少用。因为全局变量
会一直在浏览器的内存当中，耗费内存空间
能使用局部变量尽量使用局部变量。
局部变量：
在函数体当中声明的变量，包括一个函数的形参都属于局部变量，
局部变量的声明周期是：函数开始执行时局部变量的内存空间开辟，函数执行结束之后，局部变量的内存空间释放。
局部变量声明周期较短。
事件
(1)blur 失去焦点
(2)change下拉列表选中项改变，或文本框内容改变
(3)click 鼠标单击
(4)dbclick 鼠标双击
(5)focus 获得焦点
(6)keydown键盘按下
(7)keyup键盘弹起
(8)load页面加载完毕
(9)mousedown鼠标按下
(10)mouseover鼠标经过
(11)mousemove鼠标移动
(12)mouseout鼠标离开
(13)mouseup鼠标弹起
(14)reset 表单重置
(15)select 文本被选定
(16)submit 表单提交
任何一个事件都会对应一个事件句柄，在事件前加on
事件句柄以属性的形式存在。
正则表达式
常见的正则表达式符号
. 匹配除换行符以外的任意字符
\w 匹配字母或者数字或者下划线或者汉字
\s匹配任意的空白字符
\d匹配单词的开始或结束
^ 匹配字符串的开始
$ 匹配字符串的结束。
*重复零次或更多次
+重复一次或更多次
？重复零次或一次
{n} 重复n次
{n,} 重复n次或者更多次
{n,m} 重复n到m次
\大写字母 （否定）
[^x]
{^aeiou}
第一种方式：
var r =/正则表达式/flags;
第二种方式：(使用内置支持类)
var r =new RegExp("正则表达式","flags");
关于flags :
g：全局变量
i:忽略大小写
m:多行搜索。前面是正则表达式时，m不能使用，只是前面是普通字符串的时候，m可以使用，
正则表达式的test()方法
true/false =正则表达式对象.test(用户的字符串).
注意
window.alert(“hello world”); //alert函数会阻塞整个页面的加载。
vue
vue的缩略图：vue-preview
编程式导航
网页中有两种跳转方式：
- 使用a标签的形式，标签跳转
- 使用js脚本条状，window.location.href，变成跳转
路由跳转：
this.$router.push('/home/goodsinfo/' + id);
// 也可以传递对象
this.$router.push({path:"'/home/goodsinfo/' + id"});
//传递路由和参数
this.$router.push({name:"goodsinfo",param:{id:id}});
需要区分 r o u t e 和 route和 route和router：
- this.$route 是路由参数对象，所有路由中的参数，包括params和query都属于他。
- this.$router 是路由导航对象，用它可以使用js代码实现路由的前进和后退，跳转到url地址。
码云提交代码
git add .
git commit -m “第四天，打卡”
git push
vuex
vuex 是一个专为vue.js应用程序开发的状态管理模式（公共数据管理工具），为保存组件之间的共享数据诞生的，共享的数据可以放到vuex内部，相当于一个共享仓库。
安装：
npm install vuex -D
或者 npm install vuex --save
导入、注册 vuex包
import Vuex from 'vuex'
Vue.use(Vuex)
创建vuex数据仓储对象
var store = new Vuex.store({
state:{
//类似vue中的data，用于存储数据
count:0
},
mutations:{
//类似vue中的methods
increment(state){
state.count++
},
substrace(state,obj){
state.count-=(obj.a + obj.b);
}
},
getters:{
// 只负责对外提供数据，不能修改数据，修改的需要在mutation中
// 使用$store.getters.optCount
optCount:function(state){
return '当前最新的count值：' + state.count;
}
}
})
在vue中引用
var vm = new Vue({
el:'#app',
data:{
msg1:'welcome',
},
store:store,
})
如果在组件中访问store中的数据，需要通过 this.$store.state.XXX 的方式
如果vuex创建的store挂载到了vm实例上，只要挂载到了vm上，就能全局访问，$store.state
如：
<h3>总数量:{{$store.state.count}}</h3>
<script>
export default {
methods:{
plus(){
this.$store.state.count++;
}
}
}
</script>
如果要操作state中的值，推荐通过mutation里面的方法操作，防止数据紊乱
this.$store.commit(‘方法名称’)，默认第一个参数为state
例如上面的方法修改为：
plus(){
// this.$store.state.count++;
this.$store.commit('increment')
},
mutations中的函数参数列表中最多支持两个参数，即支持传入一个参数2，可通过对象的方式传入多个参数
methods:{
plus(){
// this.$store.state.count++;
this.$store.commit('increment')
},
minus(){
var obj = {
a:2,
b:1
}
this.$store.commit('substrace',obj);
}
}
访问时，可以使用如下方式：
<h3>{{$store.getters.optCount}}</h3>
总结：
- state中的数据最好不要修改，如果修改可通过mutations中的方法
- 如果组件想要从state中获取数据，同故宫this.$store.state.xxx
- 通过组件修改数据同故宫mutations的方法，this.$store.commit(‘方法名’)
- 如果需要对获取的数据进行统一包装，可以使用getters
- 使用getters，可以通过this.$store.getter.***方法
移除监听window resize事件，debounce
mounted() {
window.addEventListener('resize', this.resize, true)
},
beforeDestroy() {
window.removeEventListener('resize', this.resize, true)
},
methods: {
resize: debounce(function() {
this.radarChart.resize()
}, 300),
}
socketio
总是提示跨域问题，解决：
var io = require('socket.io')(http, { cors: true });后面的参数{ cors: true }是关键，
后台代码：
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http, { cors: true });
app.get('/', function(req, res){
res.send('<h1>你好web秀</h1>');
});
io.on('connection',function(socket) {
console.log("有人链接");
//接收数据
socket.on('send', function (data) {
console.log(data);
// 发送数据
socket.emit('resend', {
msg: `你好${data.msg}`,
code: 200
});
});
});
http.listen(3000, function(){
console.log('listening on *:3000');
});
原文链接：https://blog.csdn.net/weixin_44827418/article/details/122409863
前端
<template>
<div class="hello">
<input type="text" v-model="msg">
<button @click="sendMsg">发送</button>
</div>
</template>
<script>
import io from 'socket.io-client'
export default {
name: 'HelloWorld',
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
},
mounted () {
const socket = io('ws://localhost:3000')
this.socket = socket
window.socket = socket
socket.on('connect', function () {
console.log('连接建立成功了！')
})
socket.on('disconnect', function () {
console.log('断开连接了')
})
socket.on('resend', function (data) {
console.log(data)
})
},
methods: {
sendMsg () {
// 发送信息给服务端
this.socket.emit('send', {
msg: this.msg
})
}
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
映射外网
可以使用ngrok将本机映射为一个外网的web服务器
（使用美国的服务器，所以比较慢）
ngrok http 80
使用http方式启动，映射本机80端口
复选框手动选中触发事件写法
$('#id').prop('checked',true).change();
bootstrap table中selectpicker在表内的解决
现象：
表格内容填充样式，下拉框的选项在表格内显示
我解决的方法，修改表格的样式，去除overflow auto：
$('#newUserTableContainer .fixed-table-body').css('overflow-x','visible')
$('#newUserTableContainer .fixed-table-body').css('overflow-y','visible')
效果：
我想要的效果。
bootstrapValidator 校验红框样式模态窗中不清除
现象：模态窗中有复选框和相应要校验的输入内容，勾选时校验，取消勾选时不校验，如下：
$('#checkbox').change(function(){
$('#From').bootstrapValidator('addField',$('#input'),{
validators: {
notEmpty: {
message: '不能为空'
}
}
});
if(!$('#checkbox').is(':checked')){//没有勾选
$('#From').bootstrapValidator('removeField',$('#input'));
}
})
如果取消勾选 ，关闭弹窗后，再次打开，之前校验的样式还在。
解决方法：清空校验前，先把对应字段添加上
var param;
$('#Dialog').on('hidden.bs.modal',param, function (event) {
$('#From').bootstrapValidator('addField',$('#input'),{});//校验内容貌似可以不写
$("#From").data('bootstrapValidator').destroy();
$('#From').data('bootstrapValidator',null);
})
点击事件执行了两遍
这里主要记录下思路，原因是自己使用$('#button').click(function(){})注册点击事件写到了函数中，而此函数被重复调用，相当于注册了两遍，导致了此现象，可以修改逻辑，或者改成以下写法：
$("#button").unbind("click").click(function(){});
bootstrap Table 表头重复
现象：在tab标签页中有个表格，切换tab页时，表格经常会表头重复。
解决方法：查找了很多都不合适，参考模态窗中表格的解决方法，在tab事件中重置表格。
$('#myTab a[href="#sheet"]').on('shown.bs.tab', function (e) {
$('#Table').bootstrapTable('resetView');
})
好像动态加载的样式都会收到隐藏的影响。
谷歌浏览器本地文件访问
记录下：右键点击chrome.exe，选择“创建快捷方式”或者“发送到”→“桌面快捷方式”），右键点击快捷方式，选择属性。 然后将“–enable-webgl --ignore-gpu-blacklist --allow-file-access-from-files”参数加到原来的参数后面
XMLHttpRequest请求发送JSON
注释的部分为常用的格式
var xmlhttp = new XMLHttpRequest();
xmlhttp.open('POST', url, true);
// xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
// xmlhttp.send('datas=1');
xmlhttp.setRequestHeader("Content-Type", "application/json");
xmlhttp.send(JSON.stringify(postData));
Unexpected token } in JSON at position 571
我遇到的是结尾前有个逗号，即最后一个属性后不可以加逗号
项目更新了node版本后
大概做了以下工作，防止以后忘了
- 删除了package.json 和 package-lock.json ，同样还有node_module
- 所以需要对应的
npm init和npm install --D； - 但是还是没有解决对应的node版本，所以将本机的全局nodejs卸载后重新安装了对应版本的node
- 以上操作也解决了sqlite3的安装失败问题，以为之前是32位，现在换成了64位，感觉是安装时根据系统的node版本进行编译了，光是更换了项目中node.exe还是不够；
- 运行是不识别ejs，``npm install ejs --D"；
vscode不进入断点，不打印信息
全局nodejs使用的8.12.0，更换为14.16.0后可以正常打印信息
heapdump安装
正常执行npm install heapdump --save
可能会报错提示： stack Error: Can’t find Python executable “python”
这是可以单独下载python2.7，应该是这个地址 ，然后配置系统环境变量：
- PYTHONPATH ：值是安装目录，例如C:\Python27
- PYTHON ：值是%PYTHONPATH%\python.exe
- 修改设置：
npm config set python "C:\Python27\python.exe"
还有需要注意的是，项目运行的node版本和环境的版本最好一直，这样安装的才能使用。
JSON.parse unexpected 错误
- Unexpected token , in JSON at position ；最终结果是数据格式拼错误
var oridata = {
"AVG" : -4.021018037335511e+32,
"R" : 4.021426879624494e+33,
"SD" : 1.271627581241022e+33,
"T" : "2021-10-8 14:21:1.0",
"V" : [
-4.021217341801231e+33,
7855378683396096.,
-7679397230280704.,
1.715589746709156e-06,
-2.812386810279686e-26,
-1.023335754305393e+28,
-1708748175310848.,
-2.720618786030415e-32,
2.095378232633429e+29,
6820374016.0
]
}
其中的数组中有一个很大的数，导致拼接的时候小数点后没有数字
- 大佛寺
数据库
sqlserver2008 mdf过大
本以为删除表truncate table tableName后就会变小，结果并没有;
搜索后发现，需要右键数据库，任务，收缩，数据库，操作后，mdf变小了
sqlite插入字符串带单引号
INSERT INTO "Roles" (Name,ID) VALUES ('i am ''haha''',2)
用单引号将单引号包含起来
67
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
