JS原生方法

箭头函数和this的用法

1.先看一下箭头函数=>

  • (x)=> x+6等价于
function(x){
    return x+6
}
  • let varible = (n1 , n2) => n1 + n2;等价于
var varible = function(n1 , n2){
    return n1 + n2;
}
  • 若没有参数,也必须有()即let sum= () => 1+2;等价于
let sum = function(){
    return 1+2;
}
  • 若需要返回一个自定义对象,用()括起来
let item = id => ({
    id : id;
    name : "abc"
})
// 等价于
let item = function( id ){
    return {
        id : id;
        name : "abc"
    };
};
  • 应用:使用定制比较器排列数组
let result = values.sort((a,b) => a-b);

2.this用法

  • this是一个指针,指向环境作用域(上下文)
  • 指得是调用函数的对象
  • 用法
    • 全局调用
var a;
function get_a(){
    return this.a;
}
* 对象方法的调用,值得时上级对象
function get_a(){
    console.log(this.a)
}

var p = {};
p.a = 3;
p.run = get_a;
p.run();        //3
* 构造函数中使用,指的是创建的对象
* apply调用

理解一下这个方法(满足条件返回true):Array.some(function(v,i),thisArgs)
thisArgs时function函数中this的指向,如果thisArgs是String类型,this会对应截取这个字符串
【Eg】

let arr = [4,5,8,9];
var newArr_1 = arr.some(unction(v,i,arr){
    console.log(arr); /[4,5,8,9]]
    console.log(this); //{this: 'this'}
    v>=2;
},{this:'this'})
console.log(re); //2

var newArr_2= arr.some(function(v,i,arr){
    console.log(this); //输出一下是什么结果????????????
    v>=10;
},'_this')
console.log(re2); //undefined

2.map, reduce, find, filter, forEach, includes

1. map映射

var new_array = arr.map(callback[, thisArg]) 
  • 应用:反转字符串
var str = '12345';
Array.prototype.map.call(str, function(x) {   //同时利用了call()方法
  return x;
}).reverse().join(''); 

2.filter过滤:找到满足条件的数保存到新的数组中

arr.filter((item, index, this) => {
    condition(item)
}

3.forEach 遍历数组的每一个元素

//forEach
array.forEach(callback(currentValue, index, array){
    //do something
}, this)
//或者
array.forEach(callback(currentValue, index, array){
    //do something
})  

另外还有一个each

//$.each()
$(selector).each(function(index,element))  //注意参数的顺序

举例data.forEach(function(v,i, a){ a[i] = v + 1; });

  • forEach和map的区别
    • forEach返回值为undefined,map返回一个新的数组,对原数组没有影响
    • forEach没有办法跳出循环,$each()为每个元素规定运行函数,可以返回布尔值,跳出循环
  • forEach遍历整个数组,不会中途跳出或终止循环,若想中途停止循环,需要抛出一个一场

4.find方法:找出第一个符合条件的数据

Array.find(function(v,i,arr),thisArgs}

v:数组值
i:索引
arr:当前数组
thisArgs:fn函数中this指向

5.findIndex方法:返回符合条件的第一个数据的索引

array.findIndex(function(currentValue, index, arr), thisValue)
findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素的索引位置位置。
findIndex() 方法为数组中的每个元素都调用一次函数执行:
当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
如果没有符合条件的元素返回 -1
注意: findIndex() 对于空数组,函数是不会执行的。
注意:findIndex() 并没有改变数组的原始值

6.includes

你可能感兴趣的:(JS原生方法)