1.判断对象为空的方法
1）Object.keys({}).length === 0 // true
2）Object.getOwnPropertyNames({}).length === 0 // true
3）JSON.stringify({}) === '{}' // true
2.判断是否为数组
1）Array.isArray([]) // true
2）Object.prototype.toString.call([]) === '[object Array]'; // true
3）[].constructor.toString().indexOf('Array') !== -1; //true
3.js变量
1）使用var声明的变量，其作用域为该语句所在的函数内，且存在变量提升现象；
使用let声明的变量，其作用域为该语句所在的代码块内，不存在变量提升；
使用const声明的是常量，在后面出现的代码中不能再修改该常量的值。
2）js变量提升：变量可以在使用后声明，也就是变量可以先使用再声明
4.创建对象的四种方式
1）对象字面量方式创建方式
var obj = {name: 'tom', age:23}
2）工厂方式创建对象
function createObj(){
var obj = new Object();
obj.name = 'tom';
}
3）构造函数方式创建对象
function createObj(){
this.name = 'tom';
}
var obj = new createObj();
4）用原型链方式
function CreateObj(){}
CreateObj.prototype.name = 'tom';
var obj = new CreateObj();
5.object的操作
1）Object.keys 获取对象的所有keys值 为数组形式
2）Object.values 获取对象的所有values 为数组形式
3）{}.hasOwnproperty('key') 判断对象是否有key属性
4）for(x in obj) 循环对象
6.number
1）toString 转成字符串 括号里可加基数
2）toFixed 转成字符串，括号指定保留小数点后位数
3）toLocaleString 格式化数字，每三个加逗号
4）toExponential 转成指数表示
7.Math
1）Math.round(0.6) // 1 四舍五入
2）Math.ceil(0.4) // 1 向上取整
3）Math.floor(0.9) // 0 向下取整
4）Math.max(1,2,3,4) // 4
5）Math.min(1,2,3,4) //1
6）Math.random() * (max - min + 1) + min //随机数
8.Date
1) date.getFullYear()
2) date.getMonth()
3) date.getDate()
4) date.getDay() //获取星期几
5) date.getHours()
6) date.getMinutes() //分钟
7) date.getSeconds() //秒
8) date.getMillseconds() //毫秒
9) date.getTime() //1970.1.1 至今的毫秒数
9.array
1) concat() //连接多个数组，并返回结果
2) join() //把数组分割成字符串 如[1,2].join(',') => "1,2"
3) pop() // 删除并返回数组的最后一个元素
4) pusp() //向数组的末尾添加一个或更多元素，并返回新的长度
5) unshift() //向数组的开头添加一个或更多元素，并返回新的长度
6) shift() // 删除并返回数组的第一个元素
7) sort() // 对数组进行排序
8) reverse() // 颠倒数组
9) toString() // 把数组转为字符串
10) slice(start, [end]) // 返回数组指定元素
11) splice(index, count, [add]) // 从数组中删除指定元素，并返回被删除内容(数组格式)
index: 位置； count：删除数量；add：添加元素 可选
[1,2,3].splice(-1,1) => [1,2]
[1,2,3].splice(1,2,4) =>[1,4]
10.string
1) slice(start, [end]) // 截取字符串
2) substring(start, [stop]) // 截取字符串， 与slice相似，但不允许负的参数；如果参数 start 与 stop 相等，那么该方法返回的就是一个空串（即长度为 0 的字符串）。如果 start 比 stop 大，那么该方法在提取子串之前会先交换这两个参数。
3) substr(start, length) // 截取字符串
4) charAt() // 返回在指定位置的字符
5) concat() //拼接字符串
6) indexOf() // 检索字符串
7) lastIndexOf() // 从后向前检索
8) match() // 找到与正则的匹配 ('match1match2').match(/d+/g) => [1,2];
9) replace() // 替换与正则相匹配的值 ('match1match2').replace(/d/g, '||') => ('match||match||')
10) search() // 检索与正则匹配的值 ('match1match2').search(/d/g) => 5
11) toUpperCase() // 把字符串转为大写
12) toLowerCase() // 把字符串转为小写
13) split('&') 字符串按‘&’进行分割
11. js全局函数
1）encodeURL() 把字符串编码为url
2）decodeURL() 解码某个URL
3）escape() 对字符串进行编码
4）unescape() 进行解码
5）parseFloat() 解析一个字符串并返回一个浮点数
6）parseInt() 解析一个字符串并返回一个整数
第二个参数可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。
如果省略该参数或其值为 0，则数字将以 10 为基础来解析。如果它以 “0x” 或 “0X” 开头，将以 16 为基数。
如果该参数小于 2 或者大于 36，则 parseInt() 将返回 NaN
parseInt(1, 0) // 1 parseInt(1, 1) // NaN parseInt(2, 2) // NaN
7）Number() 把对象的值转为数字
8）String() 把对象的值转为字符串
12. js正则
1）/正则主体/修饰符 ==> /^d+$/g 或 var r = new RegExp('\d', 'g')
/^1[34578]d{9}$/g 和 /d+.d+/g
2) 修饰符
i：忽略大小写；
g：执行全局匹配；
m：执行多行匹配
3）方括号
[abc]：查找方括号之间的任何字符
[^abc]：查找任何不在方括号之间的字符
[0-9]：查找任何0-9的数字
[a-zA-Z]：查找任何从小写a到大写Z的字符
4) 元字符
w 查找单词字符
d 查找数字
D 查找非数字字符
s 查找空白字符
查找单词边界
5) 量词
n+ 匹配任何包含至少一个n的字符串
n* 匹配任何包含零个或多个n的字符
n? 匹配任何包含零个或一个n的字符
n{x} 匹配包含x个n的字符
n{x,} n连续出现至少x次时匹配
n{x,y} n连续出现至少x次，至多y次时匹配
n$ 匹配任何结尾为n的字符
^n 匹配任何开头为n的字符
13.http请求
1.get请求
1) var xhr = new XMLRequest()
2) xhr.onreadystatechange = function(){
if(xhr.readyState === 4 && xhr.status === 200 || xhr.status === 304) // 成功的回调函数
}
3) xhr.onerror = function(){}
4) xhr.open('GET', url, true) //true: 是否为异步请求
5) xhr.send()
2. post请求
1) var xhr = new XMLRequest()
2) xhr.onreadystatechange = function(){
if(xhr.readyState ===4 && xhr.status === 200 || xhr.status === 304){}
}
3) xhr.open('POST', url, true)
4) xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded')
5) xhr.send('name=tom&age=12')
14.杂
1.getXX和queryXX的区别：
1).getXXXByXXX 获取的是动态集合，querySelector获取的是静态集合
2).getXXX可以接受错误的参数，queryXX则严格符合 CSS 选择符规范的
3).getXX性能要快
使用场合：
正常情况下使用getXX，如果得到的元素需要很麻烦的多次getElementBy..组合才能得到的话使用querySelector，方便
2.将argument转成数组
var args = Array.prototype.slice.call(arguments);
3.数字格式化
var n = 123456789;
n.toLocaleString() ==> "123,456,789"
4.数组去重
[...new Set([1, "1", 2, 1, 1, 3])] ==》[1, '1', 2, 3]
5.数组填充
arr.fill(value[, start[, end]])
Array(6).fill(8) ==》[8,8,8,8,8,8]
6.一行代码一个插件
"★★★★★☆☆☆☆☆".slice(5 - rate, 10 - rate);
7.+一元运算可以是字符串转为number
+ new Date ==》1525186216452
+‘1.1’ ==》 1.1
8.js 对input进行输入监听
var input = document.getElementById('input');
input.oninput = function (ev) {}
9.短路运算var a = b && 1
// 相当于
if (b) {a = 1
} else {
a = b
}var a = b || 1
// 相当于
if (b) {a = b
} else {a = 1
}
10.css方面
关于 css子元素浮动后父元素高度不能自动撑开 问题
1.给父元素添加样式：overflow: hidden;
2.在父元素最后添加一个空元素，空元素加上样式：clear: both;
3.将父元素一起浮动；
11.总结：XML和HTML的区别？
1)XML标签可以任意指定，但HTML标签是固定的；
2)XML语法非常严格，HTML语法非常松散；
3)XML用于描述和存储数据——类似于数据库；HTML用于展现网页的结构，只用于浏览器；
12.dom操作
1. 在父元素末尾追加:
parent.appendChild(child)
2. 插入到父元素下的现有子元素之前:
parent.insertBefore(child, oldChild)
3. 替换父元素下现有子元素
parent.replaceChild(child, oldChild)
13.拷贝对象
var b=JSON.parse(JSON.stringify(a))
14.交换两个值
a = [b,b=a][0];
15.使页面的每个元素加上边框
[].forEach.call($$("*"),function(a){
a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16)
})
16.禁止频繁操作
var click = (function(){
var isClick = true;
return function(params, time){
if(isClick){
//todo
isClick = false;
console.log(params);
setTimeout(function(){
isClick = true;
}, time)
}
}
})();
click('click count', 3000)
17.数字格式化（添加千分位）
1234567.1.toLocaleString()//1,234,567.1
更多请查看https://juejin.im/post/5ac472016fb9a028c22afa9d
18.将多维数组转为以为数组
arr.join(',').split(',')
[[1,2,3],4,5,[[6,7]]].join(',').split(',')//["1", "2", "3", "4", "5", "6", "7"]
19.获取数组倒数的元素
arr.slice(-1) 获取倒数一个元素
arr.slice(-2) 获取倒数两个元素
20.数组重洗
arr.sort(()=> (Math.random() - 0.5))