美文网首页
JS对象常用方法总结

JS对象常用方法总结

作者: 秀萝卜 | 来源:发表于2020-05-29 15:12 被阅读0次

    string

    方法一:charAt():返回在指定位置的字符

    var str = 'nihaome wozhendexiangxeuhaoqianduan'
    var str2 = str.charAt(4);//字符串的下标是从1开始的,所以返回o
    var str3 = str.charAt(25); //25位置是a;
    var str4 = str.charAt(5,26); //传入两个参数,不会报错,但是第二个参数默认无效,
    //所以返回的是位置5的字符m
    console.log(str2);
    console.log(str3);
    console.log(str4);
    
    
    image

    方法二:charCodeAt():返回咋指定位置的字符的Unicode编码

    var str = "llinihao mezaigama";
    var str2 = str.charCodeAt(5);//位置5的字符是h,h的Unicode编码是104
    var str3 = str.charCodeAt(3);
    console.log(str3); //110
    console.log(str2);
    
    
    image

    方法三:concat():连接字符串

    var str1 = "lixiaoqi";
    var str2 = 'zaijian';
    console.log(str2.concat(str1));//把str1连接到str2上
    
    
    image

    方法四: indexOf(): 检索字符串,返回的是字符在字符串的下标

    var str1 = "lixiaoqi";
    var num1 = str1.indexOf('o'); //检索字符串,返回的是字符在字符串的下标
    //字符串的下标是从0开始计数
    var num2 = str1.indexOf('lllll'); //没有找到匹配的值,返回-1
    var num3 = str1.indexOf('ni'); //没有找到匹配的值,返回-1
    console.log(num1);
    console.log(num2);
    console.log(num3);
    
    
    image

    方法五:match():在字符串内检索指定的值或找到一个或多个正则表达式的匹配,返回的是值而不是值的位置。

    var str1 = "lixiaoqi";
    var str2 = str1.match('iao'); //检索字符串,返回的是字符
    var str3 = str1.match('lll');//没有指定的字符,返回的是null
    console.log(str2);
    console.log(str3);
    
    
    image

    方法六:replace():替换匹配的字符串

    var str1 = "nihaome";
    var str2 = "lixiaoqi";
    var str3 = str1.replace(str1.match('hao'),str2.match('lixi'));
    //找到str1的hao,找到str2的lixi,用str2替换掉str1
    console.log(str3);
    
    
    image

    方法七:search():检索与字符串匹配的子串,返回的是地址

    var str1 = "lixiaoqi nihaoya zaiganma";
    var str2 = "nihaoya";
    var str3 = "wobuzai";
    var num1 = str1.search(str2);//返回的是第一个字符所在的位置
    var num2 = str1.search(str3); //未检测到返回-1
    console.log(num1);
    console.log(num2);
    
    
    image

    方法8:slice():提取字符串片段,并在新的字符串中返回被提取的部分

    var str1 = 'nihaoya wobuhaoya'
    console.log(str1.slice(4,9)); //4位置开始,到9的前一个位置结束
    console.log(str1.slice(2,14));//start位置开始,end前一个位置结束
    console.log(str1);//原字符串不变
    console.log(str1.slice(-1,0)); //返回的是空字符串
    console.log(str1.slice(30,100)); //长度超过字符串的长度,返回空字符串
    console.log(str1.slice(-1,10));//返回的是空字符串
    
    
    image

    方法9:split():把字符分割成数组

    var str1 = "nihao-zaijian-dajiahao";
    console.log(str1.split(''));
    var str2 = str1.split('-');
    console.log(str2);
    console.log(str1);//原字符串不变
    
    
    image

    方法10:toLocaleLowerCase():把字符串转换成小写

    var str = "NIHAOME WOHENHAOnizaiganmane";
    console.log(str.toLocaleLowerCase());
    var str1 = str.toLocaleLowerCase();
    console.log('-----------');
    console.log(str1);
    console.log(str);//原字符串不变
    
    
    image

    方法11:toLocaleUpperCase():把字符串准换成大写

    var str = "deawwWWEzaiganmane";
    console.log(str.toLocaleUpperCase());
    var str1 = str.toLocaleUpperCase();
    console.log('-----------');
    console.log(str1);
    console.log(str);//原字符串不变
    
    
    image

    方法12:toLowerCase():把字符串转换成小写

    var str = "deawwWWEzaiganmane";
    console.log(str.toLowerCase());
    var str1 = str.toLowerCase();
    console.log('-----------');
    console.log(str1);
    console.log(str);//原字符串不变
    
    
    image

    方法13:toUpperCase():把字符串转换成大写

    var str = "deawwWWEzaiganmane";
    console.log(str.toUpperCase());
    var str1 = str.toUpperCase();
    console.log('-----------');
    console.log(str1);
    console.log(str);//原字符串不变
    
    
    image

    方法14:substr():从起始索引号提取字符串中指定书目的字符

    var str = "nihaoya wohenhao dajiahao"
    var str3 = str.substr(3,19);//字符串中空格不占位置,从3开始,到19结束
    console.log(str3);
    
    
    image

    方法15:subString():提取字符串中两个指定索引号之间的字符

    var str = "nihaoya wohenhao dajiahao"
    var str3 = str.substring(3,19);//字符串中空格占位置,从3开始,到18结束
    var str4 = str.substr(3,19);//空格不占位。从3开始到19结束
    console.log(str4);
    console.log('-------------');
    console.log(str3);
    
    
    image

    数组array

    方法1:slice[start,end]:返回从原数组中指定开始下表到结束下表之间的项组成的新数组(原数组不变)

    • 1个参数:n,即n到末尾的所有
    • 2个参数:[start,end]
    var arr = [1,2,3,4,5,6,7,8];
    var arr1 = arr.slice(2,6);
    console.log(arr1);
    //数组下表从0开始,从2开始,到6的前一个位置结束
    var arr3 = arr.slice(4); //从4开始到结束
    console.log(arr3);
    
    
    image

    方法2:splice():

    • 删除,2个参数,起始位置,删除的项数
    var arr = [1,2,3,4,5];
    var arr1 = arr.slice(2,3); //实际得到的新数组的项数是end-strat;
    console.log(arr1);
    var arr2 = arr.slice(1,5);
    console.log(arr2);
    console.log(arr);
    
    
    image
    • 插入:3个参数,起始位置,删除的项数,插入的项。
    • 替换,任意参数,起始位置,删除的项数,插入任意数量的项数

    方法3:pop():删除数组的最后一个元素,减少数组的长度,返回被删除的值

    var arr = [1,2,3,4,5];
    console.log(arr.length);
    console.log('-----------');
    var arr1 = arr.pop(); 
    console.log(arr1); //5
    console.log(arr.length);
    
    
    image

    方法4:push():将参数添加到数组的最后,返回新数组的长度

    var arr = [1,2,3,4,5];
    console.log(arr.length);
    console.log('-----------');
    var num = arr.push(6,7,8); 
    console.log(num); //返回的是新数组的长度
    console.log(arr); //原数组被改变成新数组
    
    
    image

    方法5:shift():删除数组的第一个参数,数组的长度减1,无参

    var arr = [1,2,3,4,5];
    console.log(arr.length);
    console.log('-----------');
    var arr1 = arr.shift(); 
    console.log(arr1); //返回的是删除的数组的值
    console.log(arr); //原数组被改变成新数组
    
    
    image

    方法6:unshift():像数组的开头添加一个或更多的元素,并返回新的长度。(参数不限)

    var arr = [1,2,3,4,5];
    console.log(arr.length);
    console.log('-----------');
    var arr1 = arr.unshift(2,4,5,{name:'liqi'}); 
    console.log(arr1); //返回的是新数组的长度
    console.log('------------');
    console.log(arr); //原数组被改变成新数组
    
    
    image

    方法7:sort():按指定的参数对数组进行排序,返回的值是经过排序后的数组(无参,函数)

    var arr = [1,'q',3,6,2,'a',9];
    console.log(arr);//原数组
    var arr1 = arr.sort();
    console.log(arr1);//返回的是排序后的数组
    console.log('-------------------');
    console.log(arr);//原数组变成新数组
    
    
    image

    方法8:concat(3,4):把两个字符串连接起来,返回的值是一个副本(参数不限)

    var arr1 = [1,'q',3,6,2,'a',9];
    var arr2 = [{name:'niho'},1,4];
    console.log(arr1.concat(3,arr1));//新创建一个数组,原数组不变
    console.log(arr1);
    console.log(arr2);//原数组不变
    
    
    image

    方法9:join():将数组的元素组成一个字符串,以separator(分割器)

    var arr1 = [1,'q',3,6,2,'a',9];
    var arr2 = arr1.join(',');//以逗号分隔
    var arr3 = arr1.join('');//以空格分隔
    console.log(arr1);//原数组不变
    console.log(arr2);
    console.log(arr3);
    
    
    image

    方法10:indexOf():从数组的开头向后查找,接受两个参数,要查找的项和查找起点的位置索引

    var arr = [1,2,3,4,5,6,78];
    var num = arr.indexOf(78,3);//查找78所在的位置
    console.log(num); //返回的项的索引
    var num1 = arr.indexOf(3,1);
    console.log(num1);
    var num2 = arr.indexOf(2);
    console.log(num2);
    console.log(arr);
    
    
    image

    方法10 :foeEach():对数组的每个元素执行一次提供的函数。

    var array1 = ['a', 'b', 'c'];
    
    array1.forEach(function(element) {
      console.log(element);
    });
    
    
    image

    方法11:对数组的每一项运行给定的函数,返回没戏函数调用的结果组成的数组

    var array1 = [1, 4, 9, 16];
    const map1 = array1.map(x => x * 2); //对数组的每项*2
    console.log(map1);
    
    
    image

    for in方法:遍历数组

    var arr = [1, 4, 9, 16];
    for (var i = 0; i < arr.length; i++){
        console.log(arr[i]);
    }
    
    
    image

    ES5-every和some方法:

    1. every是所有函数的每个回调都返回true的时候才会返回true,当遇到false的时候终止执行,返回false。
    2. some函数是存在有一个函数返回true的时候终止执行并返回true,否则返回false。
    // every
    var arr = [1,6,8,-2,-5,7,-4]
    var isPositive = arr.every(function(value){
        return value > 0;
    })
    console.log(isPositive) // false
    //some
    var arr = [1,6,8,-2,-5,7,-4]
    var isPositive = arr.some(function(value){
        return value > 0;
    })
    console.log(isPositive) // true
    
    

    ES5-Array.isArray(obj)

    这是Array对象的一个静态函数,用来判断一个对象是不是数组

    var arr = [3,4,5]
    console.log(Array.isArray(arr)); // true
    // ES3的判断方法
    console.log(typeof arr); // object
    console.log(arr.toString()); // 3,4,5
    console.log(arr instanceof Array); //true
    
    

    ES5-filter(function(element))

    返回数组的一个子集,回调函数用于逻辑判断是否返回,返回true则把当前元素加到返回数组中,false则不加
    新数组只包含返回true的值,索引确实的不包括,原数组保持不变。

    var arr = [1,6,8,-2,-5,7,-4]
    var positiverArr = arr.filter(function(value){
        return value > 0
    })
    console.log(positiverArr); // [1, 6, 8, 7]
    console.log(arr); // [1, 6, 8, -2, -5, 7, -4]
    
    

    ES5-reduce(function(v1,v2),value) / .reduceRight(functio(v1,v2),value)

    遍历数组,调用回调函数,将数组元素组合成一个值,reduce从索引最小值开始,reduceRight反向,方法有两个参数

    1. 回调函数,把两个值合成一个,返回结果
    2. value,一个初始值,可选
    var arr = [1,2,3,4,5,6]
    console.log(arr.reduce(function(v1,v2){
        return v1 + v2;
    })) // 21
    //开始是1+2 = 3,之后3+3 =6,之后6+4 =10,之后
    //10+5 =15,最后15+6 =21
    console.log(arr.reduce(function(v1,v2){
        return v1 - v2;
    },100)) // 79
    //开始的时候100-1=99,之后99-2=97,之后97-3=94,之后
    //94-4=90,之后90-5=85,最后85-6=79
    

    作者:学的会的前端
    链接:https://www.jianshu.com/p/2aa380414a0e
    来源:简书
    著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

    相关文章

      网友评论

          本文标题:JS对象常用方法总结

          本文链接:https://www.haomeiwen.com/subject/lsoxzhtx.html