1.日期格式处理
var data="2017-11-02"; var date_fix=Number(data.replace(/-/g,""));
2.获取元素索引
<select id="mySelect" v-model="checkName" @change="getsubproject(checkName)">
<option value="">请选择</option>
<option v-for="item in checkNameOption">{{item}}</option>
</select>
var x=document.getElementById("mySelect")
alert(x.selectedIndex)
3.获取元素
var x=document.getElementById("ele");
var x=document.getElementsByClassName("ele");
var x=document.getElementsByTagName("p");
var x=document.querySelector(".ele"); //返回匹配指定选择器的第一个元素
var x=document.querySelectorAll(".ele"); //返回所有的元素
x.innerHTML;
x.innerText;
x.value;
x.selectedIndex;
4.保留两位小数
var a = 9.39393; a.toFixed(2);
5.map生成新对象数组
let data1=[];
data2.map(function(item){
let obj={};
obj.diseaseName=item.diseaseName;
obj.startTime=item.startTime;
obj.endTime=item.endTime;
data2.push(obj);
});
var data = [[10, 16, 3, 'A'], [16, 18, 15, 'B'], [18, 26, 12, 'C'], [26, 32, 22, 'D'], [32, 56, 7, 'E'], [56, 62, 17, 'F']];
var colorList=['#4f81bd', '#c0504d', '#9bbb59', '#604a7b', '#948a54', '#e46c0b'];
data = data.map(function (item, index) {
return {
value: item,
itemStyle: {
normal: {
color: colorList[index]
}
}
};
});
相关函数：reduce()
6.+new Date是什么意思？
JavaScript中可以在某个元素前使用 ‘+’ 号，这个操作是将该元素转换秤Number类型，如果转换失败，那么将得到 NaN。
所以 +new Date 将会调用 Date.prototype 上的 valueOf 方法，而根据 MDN ，Date.prototype.value 方法等同于 Date.prototype.getTime() 。
所以下列代码效果相同：
console.log(+new Date);
console.log(new Date().getTime());
console.log(new Date().valueOf());
console.log(new Date() * 1);
7.日期加一天
function formatDate(time) {
var year = time.getFullYear();
var month = time.getMonth() + 1;
var date = time.getDate();
return year + "-" + month + "-" + date;
}
//格式化函数，将毫秒转化为年月日
var startTime=new Date('2017-11-27');
endTime=startTime.setDate(startTime.getDate()+1); //天数加1
endTime=new Date(endTime) //starttime需要转化为时间对象，结果为毫秒数
endTime=formatDate(endTime); //调用函数转化为年月日
7-1.加一个月
var time = new Date() var endTime = new Date(time.setMonth(time.getMonth()+2))
8.localStorage和sessionStorage
sessionStorage.setItem("my_sessionStorage", "sessiontesttext");
sessionStorage.my_sessionStorage123='sessiontesttext123';
localStorage.setItem("my_localStorage", "localtext");
localStorage.my_localStorage123='localtext123';
localStorage.removeItem('my_localStorage');
localStorage.clear(); //清空全部localStorage
9.concat() 方法用于连接两个或多个数组,该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。
arrayObject.concat(arrayX,arrayX,......,arrayX)
10.option获取val及text
var myselect=document.getElementById('test'); //拿到select对象
var index=myselect.selectedIndex; //拿到选中项的索引
var val=myselect.options[index].value; //选中项options的value
var text=myselect.options[index].text; //拿到选中项options的text
jquery实现
var options=$('#test option:selected'); //获取选中的项
options.text(); //拿到选中项的文本
options.val(); //拿到选中项的值
$('#test).val() //拿到选中项的值,同上面方法
$('#test).get(0).selectedIndex; //选中项的索引
11.splice()和slice()
splice() 方法向/从数组中添加/删除项目，然后返回被删除的项目。
arrayObject.splice(index,howmany,item1,.....,itemX)
slice() 方法可从已有的数组中返回选定的元素。
arrayObject.slice(start,end)
12.selectionStart获取textarea中光标位置
13.刷新location.reload()与后退onclick="window.history.go(-1)"
14.函数中的arguments
function add(){
var sum=0;
for(var i=0;i<arguments.length;i++){
sum+=arguments[i];
};
return sum;
}
add(11,2,3,2,100);
15.疑惑：apply,call,
16.日期格式化
function pad2(n) { return n < 10 ? '0' + n : n }
function dateFormat(date) {
return date.getFullYear().toString() + pad2(date.getMonth() + 1) + pad2(date.getDate())
}
17.json文件中，属性名必须用双引号包裹，并且所有引号必须为双引号
18.手机号隐藏中间4位
var phone = '15151515151';
phone.replace(/(.{3}).*(.{4})/, '$1****$2')
19.URL参数解析
var paramsString = "q=URLUtils.searchParams&topic=api";
var searchParams = new URLSearchParams(paramsString);
var topic = searchParams.get("topic");
20.年月日
var myDate = new Date(); myDate.getYear(); //获取当前年份(2位) myDate.getFullYear(); //获取完整的年份(4位,1970-????) myDate.getMonth(); //获取当前月份(0-11,0代表1月) myDate.getDate(); //获取当前日(1-31) myDate.getDay(); //获取当前星期X(0-6,0代表星期天) myDate.getTime(); //获取当前时间(从1970.1.1开始的毫秒数) myDate.getHours(); //获取当前小时数(0-23) myDate.getMinutes(); //获取当前分钟数(0-59) myDate.getSeconds(); //获取当前秒数(0-59) myDate.getMilliseconds(); //获取当前毫秒数(0-999) myDate.toLocaleDateString(); //获取当前日期 var mytime=myDate.toLocaleTimeString(); //获取当前时间 myDate.toLocaleString( ); //获取日期与时间
21.sort排序
var nums = [4, 8, 1, 9, 0]; nums.sort((a, b) => a - b);
对象数组排序
function compare( a, b ) {
if ( a.last_nom < b.last_nom ){
return -1;
}
if ( a.last_nom > b.last_nom ){
return 1;
}
return 0;
}
objs.sort( compare );
一行表示
objs.sort((a,b) => (a.last_nom > b.last_nom) ? 1 : ((b.last_nom > a.last_nom) ? -1 : 0))
22.对象数组判断某属性是否存在
var inventory = [
{name: 'apples', quantity: 2},
{name: 'bananas', quantity: 0},
{name: 'cherries', quantity: 5}
];
function findCherries(fruit) {
return fruit.name === 'cherries';
}
console.log(inventory.find(findCherries)); // { name: 'cherries', quantity: 5 }
23.表单验证，金额(数字最大两位小数)
24. 金额千分位
var amount = 1234567.998 Number(parseFloat(amount).toFixed(2)).toLocaleString() // 结果 1,234,567.99
25.删除字符串中的html标签
str.replace(/<[^>]+>/g,"")
26.昨天
var day1 = new Date(); var yesterday = day1.setTime(day1.getTime()-24*60*60*1000)
27.变量提升
a=2; var a; console.log(a); //2
console.log(a); var a=2; //undefined，定义声明在编译阶段进行，赋值声明在执行阶段进行
28.Nnmber(123).toFixed(2)返回值为字符串
29.数组填充固定值
arr.fill(value[, start[, end]])
相关资料：https://segmentfault.com/a/1190000007651029
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/fill
30.一维数组转为二维
change2Array:function (data, len, arr) {
/**
* @param data 一维数组
* @param len 每个子数组长度
* @param arr 保存的新数组
*/
if (data.length <= len) {
arr.push(data)
return arr
} else {
arr.push(data.splice(0, len))
this.change2Array(data, len, arr)
}
}
31.数组转对象，展开运算符
var a=['a','b','c']
var b={...a}
32.双引号替换为单引号
var a = '{"a":"1","b":"2"}'
a = a.replace(/\"/g,"'")
33.字符串超过长度返回…
value.length>12?(value.substring(0,12))+"...":value
34.数字位数不够，进行前补零
function PrefixZero(num, n) {
return (Array(n).join(0) + num).slice(-n);
}
简要说明如下：
Array(5) => 创建了一个长度为5的空数组
console.log(Array(5));// [empty × 5]
Array(5).join(0) => 用0拼接将数组转换成字符串
console.log(Array(5).join(0));// 0000
Array(5).join(0)+91 => 通过+,实现字符串的拼接
console.log(Array(5).join(0)+91);// 000091
(Array(5).join(0) + 91).slice(-5) => slice(startIndex,endIndex)方法，用于截取
参数说明：
参数是起始位置，含头不含尾，
只有一个参数时，表示从该起始位置一直截取到最后。
参数值为负数时，表示从后往前数，如最后一位，索引是-1
35.生产6位随机数
function mathRand() {
var num = ''
for (var i = 0;i < 6;i++) {
num+=Math.floor(Math.random()*10)
}
return num
}
指定区间随机数
function random(min, max) {
return Math.floor(Math.random() * (max - min)) + min
}
36.比较是否相等
以下值经过两次逻辑非处理!!都会变成false，但是他们之间直接比较却并不一定相等
null == 0 //false !!null == !!0 //true
null,undefined为原始类型和”,0都不相等,但是null,undefined互相又相等
null == undefined //true null == '' //false
false和null,undefined不相等，
null == false //false undefined ==false //false
false,”,0互相之间相等
'' == false 0 == false '' == 0
结论：一个逻辑值和另一个值比较，会将值转化为逻辑值再比较，否则就直接比较
0 == 0 //true null == null //true undefined == undefined //true
var a = null,b = undefined,c = '',d = 0,e = false a==b //true a==c //false b==c //false a==d //false a==e //false
36(1).数字和布尔值比较
结论：数字和布尔值进行比较时，布尔转换为数字，二者再比较。
var a = 'abc'
if(a.indexOf('d')){
console.log('') // d不存在返回-1,这里是true
}
-1转为布尔为true，但是数字和布尔比较，会将true先转为数字1，如下：
-1 == true // 结果为false,
37.window.print打印功能，状态监听
打印窗口关闭:window.onafterprint
打印前:onbeforeprint
媒体查询检测打印状态@media print{}
38.console.dir与console.log区别
console.dir可以显示native code，并且可以显示dom中的所有属性
let $ele = document.querySelector('body')
console.log($ele)
console.dir($ele)
console.log(Promise)
console.dir(Promise)
39.Promise中的语法错误浏览器控制台不会报错，所以务必要在catch中打印出来
40.new Date('2023-05-03')，生成的时间是2023 08:00:00早上八点，比较计算时候需要注意
41.类(class)
子类只要继承父类，可以不写constructor ，一旦写了 ，则在constructor中的第一句话必须是super