1.react 事件绑定
-
在构造函数中使用bind 绑定this
constructor(){ super() this.click = this.click.bind(this) click() { console.log() } }
2.在调用的时候绑定this
<button onClick={this.click.bind(this)}>
3.在调用的时候用箭头函数
<button onClick={() => {this.click}}
4.使用属性初始化器语法绑定this
class app extends Component{ click = () =>{ console.log} }
2,箭头函数 一个参数可以不加括号 多个必须加
3.git reset revert 回滚 注意 分支
4.for in (遍历对象的每一个可枚举属性),包括原型链上面的可枚举属性 (js基本包装类型不可枚举 不能遍历)
Object.keys() 只能遍历自己的对象上的可枚举属性,原型链上的可枚举不能遍历
object.getownpropertyNames() 它遍历自身对象的所有属性(包括可枚举和不可枚举) 但是原型上的属性无法遍历
5.?? js中的空值合并操作符 只有当左侧为null 或者undifined时 返回右侧的值
|| 逻辑运算符 是 左为假 返回右
?. 可选链操作符 允许读取位于连接对象深处的属性 而不必验证链中的每个应用都有效 类似于 。语法 不同之处在于 在引用为空的时候不报错 该表达式短路返回值
6.html 中的crossorigin 属性
当服务端没有设置Acess-control allow origin 属性时 加上这个属性 会有良好的报错信息
7.webpack 中devserver 配置 中before属性 是在其他中间件使用前先用before 的中间件
8.sourcemap 框架使用babel 编译时 生成的 代码对应的映射关系 方便进入源码调试
9.precess.env.port : 读取当前目录的下环境变量port的值
10,nextTick() 在下次dom更新循环结束时执行延迟调用, 在修改数据后调用 获取最新的dom节点
11.object.assign 拷贝一层 并不是完全深拷贝 (参数1, 参数2 ) 合并到参数一
-
new 一个新的Formdata 对象 可以使用append 往里添加字段字段可以是blob file对象 字符串 (其他类型自动转换为字符串)
-
$('#excel-file').change(function(e) { try { new Uint8Array([1,2]).slice(0,2); } catch (e) { console.log("[Uint8Array"+e.description+"]这里使用【Array.slice】。"); //IE或有些浏览器不支持Uint8Array.slice()方法。改成使用Array.slice()方法 Uint8Array.prototype.slice = Array.prototype.slice; } var files = e.target.files; var fileReader = new FileReader(); fileReader.readAsArrayBuffer(files[0]);// 以二进制方式打开文件 fileReader.onload = function(ev) { $('#excel-file').val(''); $("#context").html(""); try { var data = ev.target.result; var workbook = XLSX.read(data, { type: 'array'}), persons = []; } catch (e) { console.error(e); return alert('文件类型不正确!'); } //遍历每张表读取 for (var sheet in workbook.Sheets) { if (workbook.Sheets.hasOwnProperty(sheet)) { persons = persons.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet],{raw:true, header:1})); console.log(persons) } } }; });
-
a href =“文件地址” do’w’nload 点击下载文件
-
input 前面加一个 label 修改input的样式 input display none
获取input 的文件名
$("#input").change(function(){
var file = $("#input").prop('files')[0]
console.log(file.name)
})
-
获取前一天
var time=(new Date(2021,4,1)).getTime()-24*60*60*1000; var yesterday=new Date(time); // var month=yesterday.getMonth(); // var day=yesterday.getDate(); yesterday=yesterday.getFullYear() + "-" + (yesterday.getMonth()> 9 ? (yesterday.getMonth() + 1) : "0" + (yesterday.getMonth() + 1)) + "-" +(yesterday.getDate()> 9 ? (yesterday.getDate()) : "0" + (yesterday.getDate())); console.log(yesterday) console.log( yesterday.split('-'))
-
this. r e f 绑 定 再 d o m 上 获 取 值 t h i s . ref 绑定再dom 上获取值 this. ref绑定再dom上获取值this.refs.xxx.value
绑定在组件上 this. r e f s 获 取 组 件 实 例 t h i s . refs 获取组件实例 this. refs获取组件实例this.refs.xxx.$el.value 获取值
19
20、照片
var file = document.getElementById('input')
var image = document.getElementsByTagName('img')[0]
var data = ''
function verificationPicFile(file) {
var filePath = file.value;
if(filePath){
//读取图片数据
var filePic = file.files[0];
var reader = new FileReader();
reader.readAsDataURL(filePic);
reader.onload = function (e) {
data = e.target.result;
//加载图片获取图片真实宽度和高度
// var image = new Image();
image.src = data
image.onload=function(){
var width = image.width;
var height = image.height;
if (width == 697 && height == 81){
console.log("文件尺寸符合!");
// image.src = data
}else {
alert("文件尺寸应为:720*1280!");
image.src = ''
file.value = "";
return false;
}
};
};
}else{
return false;
}
}
file.onchange = function(){
verificationPicFile(file)
}
21
var arr = [{ title: 'aaaa', read: 1000, hot: true },
{ title: 'bbbb', read: 300, hot: false },
{ title: 'cccc', read: 2000, hot: true },
{ title: 'dddd', read: 1900, hot: false }
];
// 第一种for
for (let i = 0; i < arr.length; i++) { console.log(arr[i]); } // 第二种forEach // forEach就是代替普通的for arr.forEach(function
(item, index, arr) {// item:循环结果 index:下标 arr:原数组 console.log(item); }, 'this指向,如果使用的是箭头函数无法改变this指向' ); // 第三种map //
它可以重新整理数据结构,可以返回一个新的数组 let newarr=arr.map((item, index, arr)=> {// item:循环结果 index:下标 arr:原数组
// console.log(item,index,arr);
let json = {};
json.t = `随便加点${item.title}----`;
json.r = `随便加点${item.read}----`;
json.h = `随便加点${item.hot}----`;
return json;
})
console.log(newarr)
// 第四种filter
// 过滤,过滤一些不合格或者不想要的元素,如果返回结果为true,就留下来
let newarr = arr.filter((item, index, arr) => {// item:循环结果 index:下标 arr:原数组
return item.hot == true;//判断即可
})
console.log(newarr, '4')
// 第五种some
// 类似查找,数组里面某一个元素符合条件,返回true
let newarr = arr.some((item, index, arr) => {
return item.title == 'dddd';
})
console.log(newarr)
// 第六种every
// 类似查找,数组里面所有的元素都要符合条件,才返回true
arr2 = [1, 3, 5, 7, 9]
let newarr = arr2.every((item, index, arr) => {
return item % 2 == 1;//判断我的数组里面是否有偶数
})
console.log(newarr)
// 第七种reduce
// 求数组的和、阶乘,从左往右计算
arr3 = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
arr4 = [2, 2, 3];
let newarr = arr3.reduce((prev, cur, index, arr) => {//prev:前一个 cur:当前 index:下标 arr:原数组
return prev + cur;
return Math.pow(prev, cur);//调用arr4的数组
return prev ** cur;//或者使用幕运算符
})
console.log(newarr)
// 第八种reduceRight
// 求数组的和、阶乘,跟reduce正好相反,从右往左计算
arr3 = [2, 2, 3];
let newarr = arr3.reduceRight((prev, cur, index, arr) => {//prev:前一个 cur:当前 index:下标 arr:原数组
// return prev+cur;
return Math.pow(prev, cur);
})
console.log(newarr)
22数组
function swapArray(arr, index1, index2) {
arr[index1] = arr.splice(index2, 1, arr[index1])[0];
return arr;
23
arr.concat([])
24 ui 按需引入
1.npm install babel-plugin-component - D
2.babel.config.js
module.exports = {
“plugins”: [
[
“component”,
{
“libraryName”: “element-ui”,
“styleLibraryName”: “theme-chalk”
}
]
]
}
3.引入
25 设置 vscode 保存格式化 首选项 设置 emmet.include json
26 public 搬用
27json排序
jsonSort:function (jsonObj) {
let arr=[];
for(var key in jsonObj){
arr.push(key)
}
arr.sort();
let str='';
for(var i in arr){
str +=arr[i]+"="+jsonObj[arr[i]]+"&"
}
return str.substr(0,str.length-1)
}
28 签名
sign(obj) {
let sign = "580589D2F1C589DF7824BA0C34F1EE02";
let arr = [];
let str = "";
let header = "";
for (var key in obj) {
arr.push(key);
}
arr.sort()
for (let i = 0, len = arr.length; i < len; i++) {
str += arr[i] + "=" + obj[arr[i]] + "&";
}
str += "secret=" + sign;
header = this.$md5(this.$sha256(str));
return header;
},
29let obj = Object.create(null) 与 let obj = {}
30 换行操作
var strs = val.split(""); //字符串数组
var str = "";
for (var i = 0, s; (s = strs[i++]); ) {
//遍历字符串数组
str += s;
if (!(i % 6)) str += "\n";
}
return str;
31 JSON判断
function isJSON(str) {
if (typeof str == 'string') {
try {
var obj = JSON.parse(str);
if (typeof obj == 'object' && obj) {
return true;
} else {
return false;
}
} catch (e) {
return false;
}
}
}
32.刷新前弹窗
window.onbeforeunload = function(){return window.event.returnValue =’’}
点击事件 去除这个提示
button.onclick = function(){
window.onbeforeunload = function () { alert(‘222’) }
}
33git 合并到分支
git add .
git commit
git checkout - env
git fetch
git merge - your branch
git push git
n false;
}
}
}
32.刷新前弹窗
window.onbeforeunload = function(){return window.event.returnValue =''}
点击事件 去除这个提示
button.onclick = function(){
window.onbeforeunload = function () { alert('222') }
}
33git 合并到分支
git add .
git commit
git checkout - env
git fetch
git merge - your branch
git push git