JS大杂烩
JS大杂烩
记录自己总是记不住的那些函数用法，和使用规则。
数组篇
遍历
for循环遍历
var arr = [1, 2, 3, 4, 5]
for (let i = 0; i < arr.length; i++) {
console.log(arr[i]);
}
forEach()遍历
forEach回调内接收三个参数，依次为当前元素，当前元素索引，被遍历数组本身
var arr = [1, 2, 3, 4, 5]
arr.forEach((item,index,self)=>{
console.log(item,index,self);
})
说明：forEach不支持break和continue即使是return也只是结束当前回调并不会结束forEach()
删除
删除指定元素
删除指定元素需要先确定被删除元素位置即调用indexOf()函数或缺被删除元素的位置，然后使用slpice()删除该元素。
splice()函数的作用是向数组指定位置添加一个或多个元素，添加的元素会覆盖原位置的元素，所以当不指定添加元素时可用来删除元素。
var arr = [1, 2, 3, 4, 5]
let index = arr.indexOf(4)
arr.splice(index,1)
console.log(arr);
说明：splice()会改变原数组内容，并且在vue中不会触发ui刷新
过滤
过滤数组元素
过滤使用filter()函数
var arr = [1, 2, 3, 4, 5]
var res = arr.filter(item=>{
return item>3
})
console.log(res);
排序
数组排序
JS数组排序是按照数组内元素的Unicode码来排序的，排序方法是sort()
var arr=[1,4,2,6,3,6,7]
arr.sort()
console.log(arr);
//result (7) [1, 2, 3, 4, 6, 6, 7]
如果排序元素为对象则调用其toString()方法进行排序。
//首先重写toString()方法以按照我们的意愿进行排序
function Person(name){
this.name=name
this.toString=function(){
return this.name
}
}
var arr=[new Person("C"),new Person("A"),new Person("B"),new Person("D")]
arr.sort()
console.log(arr);
//result (4) [Person, Person, Person, Person]
// 0: Person {name: "A", toString: ƒ}
// 1: Person {name: "B", toString: ƒ}
// 2: Person {name: "C", toString: ƒ}
// 3: Person {name: "D", toString: ƒ}
sort()函数还可以接收一个函数类型参数作为排序依据。但是返回值并不是true/false而是-1/0/1。
function Person(name) {
this.name = name
}
var arr = [new Person("C"), new Person("A"), new Person("B"), new Person("D")]
arr.sort((a, b) => {
if (a.name > b.name) {
return 1
} else if (a.name < b.name) {
return -1
} else {
return 0
}
})
console.log(arr);
//result(4) [Person, Person, Person, Person]
// 0: Person {name: "A"}
// 1: Person {name: "B"}
// 2: Person {name: "C"}
// 3: Person {name: "D"}
原型篇
JS中每个对象都有一个__proto__属性（Object对象的__proto__属性=null），它指向另一个对象，可已从当前对象中直接调用__proto__所指对象的属性和方法。
JS通过原型链来实现面向对象编程思想中的继承关系。还有一个重要概念prototype __proto__和prototype 在某些情况下这两个参数会等于同一对象。通常情况下__proto__针对实例来说，而prototype 针对类来说。
所有显示创建的对象的__proto__都是Object，通过new关键字创建的__proto__是创建该实例的构造函数的prototype（在JS中函数也可是对象）。
var student = {
name:"wxm",
age:18
}
function Person(name,age){
this.name=name
this.age=age
}
var person = new Person("wxm",18)
//上文说过Object的.__proto__=null,证明显示创建的对象的__proto__为Object
console.log(student.__proto__.__proto__); //result null
//证明通过new关键字创建的实例的__proto__是创建该实例的构造函数的prototype
console.log(person.__proto__ == Person.prototype); //result true
Promise篇
Promise 是一个对象，它代表了一个异步操作的最终完成或者失败。能够解决传统JS异步编程中回调地狱的问题。
创建Promise对象
创建一个Promise对象并为其提供一个函数类型的参数，创建后该函数参数立即执行。
var promise = new Promise((resolve,reject)=>{
console.log("Promise creating");
})
//result: Promise creating
Promise.then()的使用
Promise创建后调用then([successCallBack],[failCallback])为异步操作设置回调函数，该方法接收两个参数，第一个参数为异步操作成功的回调，第二个为异步操作失败的回调，并且这连个参数都是可选参数。
//异步操作成功演示
var promise = new Promise((resolve, reject) => {
console.log("Promise creating");
setTimeout(() => {
console.log("Already time out");
resolve()
}, 3000)
})
promise.then(
() => {
console.log("Success function has been executed");
},
() => {
console.log("Fail function has been executed");
})
//result: Promise creating
// Already time out
// Success function has been executed
//异步操作失败演示
var promise = new Promise((resolve, reject) => {
console.log("Promise creating");
setTimeout(() => {
console.log("Already time out");
// resolve()
reject()
}, 3000)
})
promise.then(
() => {
console.log("Success function has been executed");
},
() => {
console.log("Fail function has been executed");
})
//result: Promise creating
// Already time out
// Fail function has been executed
关于then()中的回调函数的说明
一下内容节选自链接
当一个Promise完成（fulfilled）或者失败（rejected）时，返回函数将被异步调用（由当前的线程循环来调度完成）。具体的返回值依据以下规则返回。如果 then 中的回调函数：
- 返回了一个值，那么
then返回的 Promise 将会成为接受状态，并且将返回的值作为接受状态的回调函数的参数值。 - 没有返回任何值，那么
then返回的 Promise 将会成为接受状态，并且该接受状态的回调函数的参数值为undefined。 - 抛出一个错误，那么
then返回的 Promise 将会成为拒绝状态，并且将抛出的错误作为拒绝状态的回调函数的参数值。 - 返回一个已经是接受状态的 Promise，那么
then返回的 Promise 也会成为接受状态，并且将那个 Promise 的接受状态的回调函数的参数值作为该被返回的Promise的接受状态回调函数的参数值。 - 返回一个已经是拒绝状态的 Promise，那么
then返回的 Promise 也会成为拒绝状态，并且将那个 Promise 的拒绝状态的回调函数的参数值作为该被返回的Promise的拒绝状态回调函数的参数值。 - 返回一个未定状态（
pending）的 Promise，那么then返回 Promise 的状态也是未定的，并且它的终态与那个 Promise 的终态相同；同时，它变为终态时调用的回调函数参数与那个 Promise 变为终态时的回调函数的参数是相同的。
//针对上文做部分验证。
var promise = new Promise((resolve, reject) => {
console.log("Promise creating");
resolve()
})
function firstChain(){
console.log("链式第一链,running");
return "第一链"
}
function secondChain(param){
return new Promise((resolve, reject) => {
setTimeout(() => {
console.log("第二链Promise异步执行完成");
param+="+第二链"
console.log(param);
resolve(param)
}, 1000)
})
}
function thridChain(param){
console.log("链式调用最后一链,running");
param+="+第三链"
console.log(param);
}
promise
.then(firstChain)
.then(secondChain)
.then(thridChain)
//result: Promise creating
// 链式第一链,running
// 第二链Promise异步执行完成
// 第一链+第二链
// 链式调用最后一链,running
// 第一链+第二链+第三链
待补充
//----------------------------------
最后
大幻梦森罗万象狂气断罪眼\ (•◡•) /
