前言
题目来自ConardLi的blog
写的是自己的题解，水平有限，所以仅供参考
代码会整合在github，觉得有帮助就给个star吧~
正文
一、Javascript基础
语法和API
1、理解ECMAScript和JavaScript的关系
ECMAScript是JavaScript的规范，JavaScript是ECMAscript的体现
2、熟练运用es5、es6提供的语法规范
ES6:
- spread展开符
- 类
- 模块化
- 箭头函数
- 函数参数默认值
- 模板字符串
- 解构赋值
- 对象属性简写
- Promise
- let const
-
const声明一个对象，能不能修改对象的属性？
答案是可以的，因为用const只是保证对象的指针不可以改变，只想地址的内容是可以改变的。 - 如果要让
const声明对象的属性也不可修改，怎么实现？
要实现真正的不可被修改的对象常量，首先我们要实现三个点：
1、对象属性不能被修改
2、对象属性不能增加
3、对象属性不能被删除
-
不能被增加，我们可以用Object.preventExtensions来实现
不能被增加和删除，我们可以用Object.seal来实现
不能被修改，我们可以用Object.freeze来实现，但是Object.freeze只能作用一层，我们需要通过递归调用
ES7:
Array.prototype.includes()
const arry = ['xiaoMing','xiaoHong','xiaoLan']
arry.includes('xiaoMing') //true
指数操作符
**
console.log(Math.pow(2,10)) //1024
console.log(2**10) //1024
ES8:
- async await
- Object.values()
const values=Object.values(obj1);
console.log(values);//[1, 2, 3]
- Object.entries()
for(let [key,value] of Object.entries(obj1)){
console.log(`key: ${key} value:${value}`)
}
//key:a value:1
//key:b value:2
//key:c value:3
- Object.getOwnPropertyDescriptors()
返回obj对象的所有自身属性的描述符，如果没有任何自身属性，则返回空对象。
const obj = {
name: 'Jine',
get age() { return '18' }
};
Object.getOwnPropertyDescriptors(obj)
3.熟练掌握JavaScript提供的全局对象（例如Date、Math）、全局函数（例如decodeURI、isNaN）、全局属性（例如Infinity、undefined）
全局对象：
- Array
- Boolean
- Math
- Number
- String
- RegExp
全局函数：
- decodeURI()
- decodeURIComponent()
- encodeURI()
- encodeURIComponent()
- escape()
- eval()
- isFinite()
- isNaN()
- Number()
- parseFloat()
- parseInt()
- String()
- unescape()
全局属性：
- NaN
- undefined
- Infinity
4、熟练应用map、reduce、filter 等高阶函数解决问题
- map
map返回一个数组，接受两个参数，第一个是回调函数，第二个是执行回调函数时用的this值，map遍历数组的每个值来做一些改变，再返回整个数组。
map实现
const arr = [1, 2, 3, 4]
arr.push(5)
Array.prototype.selfMap = function (callback, context) {
let arry = Array.prototype.slice.call(this)
let mapArry = Array()
for (let i = 0; i < arry.length; i++) {
if (!arry.hasOwnProperty(i)) {
continue
}
mapArry[i] = callback.call(context, arry[i], i, this)
}
return mapArry
}
const result = arr.selfMap(value => value + 1)
- filter
filter返回一个数组，接受的参数是一个回调函数，filter遍历数组的每一个值，当数组的值在你在filter里面的规则对应为true时，返回该数组上的值，否则不返回。
const arry = [1, 2, 3, 4]
arry.push(5)
Array.prototype.selfFilter = function (callback, context) {
let filterArry = Array()
let arry = Array.prototype.slice.call(this)
for (let i = 0; i < arry.length; i++) {
if (!arry.hasOwnProperty(i)) {
continue
} else {
callback.call(context, arry[i], i, this) ? filterArry.push(arry[i]) : filterArry.push()
}
}
return filterArry
}
const result = arry.selfFilter(value => value % 2 === 0)
- reduce
reduce接受两个参数，一个是回调函数，另一个是初始值。
const finalVal = oldArray.reduce((accumulator, currentValue, currentIndex, array) => {
...
}, initalValue)
reduce实现
const arry = [1, 2, 3, 4]
Array.prototype.selfReduce = function (callback, initialValue) {
let arr = Array.prototype.slice.call(this)
let res
let startIndex
if (initialValue === undefined) {
for (let i = 0; i < arr.length; i++) {
if (!arr.hasOwnProperty(i)) {
continue
} else {
startIndex = i
res = arr[i]
break
}
}
} else {
res = initialValue
}
for (let i = ++startIndex || 0; i < arr.length; i++) {
if (!arr.hasOwnProperty(i)) {
continue
} else {
res = fn.call(null, res, arr[i], i, this)
}
return res
}
}
5、setInterval需要注意的点，使用setTimeout实现setInterval
- setTimeout()：当方法执行完成定时器就立即停止(但是定时器还在,只不过没用了);
- setInterval()：当方法执行完成,定时器并没有停止,以后每隔[interval]这么长的时间都会重新的执行对应的方法[function],直到我们手动清除定时器为止
关于setInterval容易造成内存泄漏的说法，是由于使用者没有清除计时器造成的，setInterval不背这个锅。
实现setInterval
const mySetInterval = (cb, time) => {
const fn = () => {
cb() // 执行传入的回调函数
setTimeout(() => {
fn() // 递归调用自己
}, time)
}
setTimeout(fn, time)
}
mySetInterval(() => {
console.log(new Date())
}, 1000)
6、JavaScript提供的正则表达式API、可以使用正则表达式（邮箱校验、URL解析、去重等）解决常见问题
API：
String search
输出index值String match
输出一个数组，包括匹配的参数，匹配的index值，以及输入的字符串
当正则没有g时，使用match返回的信息比较多。但是有g后，就没有关键的信息index了。String replace
把"2,3,5"，变成"5=2+3"：
const result = "2,3,5".replace(/(\d+),(\d+),(\d+)/, "$3=$1+$2")
console.log(result)
String split
它可以有第二个参数，表示结果数组的最大长度
正则使用分组时，结果数组中是包含分隔符的RegExp test
返回true falseRegExp exec
输出一个数组，包括匹配的参数，匹配的index值，以及输入的字符串
exec方法能接着上一次匹配后继续匹配
解决常见问题：
暂时不会
7、JavaScript异常处理的方式，统一的异常处理方案
- try catch
- promise catch
- window.onerror
- window.onunhandledrejection
window.onunhandledrejection 与 window.onerror 类似，在一个JavaScript Promise 被 reject 但是没有 catch 来捕捉这个 reject时触发。并且同时捕获到一些关于异常的信息。 - window.rejectionhandled
因为 Promise 可以延后调用 catch 方法，若在抛出 reject 时未调用 catch 进行捕捉，但稍后再次调用 catch，此时会触发 rejectionhandled 事件。
统一异常处理：
toast，alert
