美文网首页
javascript中常用的方法总结

javascript中常用的方法总结

作者: 菇凉别走 | 来源:发表于2019-11-11 08:25 被阅读0次

    1、字符串

    (1)indexOf(param1,param2) 方法返回字符串中指定文本首次出现的索引(位置);
    (2)lastIndexOf(param1,param2) 方法返回指定文本在字符串中最后一次出现的索引;
    (3)search() 方法搜索特定值的字符串,并返回匹配的位置;
    param1需要检索的字符串,param2开始检索的位置
    如果未找到文本, indexOf() 和 lastIndexOf() 均返回 -1。

    search() 方法无法设置第二个开始位置参数
    indexOf() 方法无法设置更强大的搜索值(正则表达式)
    let str = 'abcdcba'
    str.indexOf('b') //返回 1
    str.indexOf('b',2) //返回 5
    str.lastIndexOf('b') //返回 5
    str.lastIndexOf('b',4) //返回1
    

    (4)slice() 提取字符串的某个部分并在新字符串中返回被提取的部分范围为半闭半开
    (5)substring() 类似于 slice()不同之处在于 substring() 无法接受负的索引;
    (6)substr() 类似于 slice()不同之处在于第二个参数规定被提取部分的长度。

    let str1 = "0123456789"
    let res1 = str1.slice(1,5); //返回1234
    //如果省略第二个参数,则该方法将裁剪字符串的剩余部分
    str1.slice(5);//返回56789 
    //如果某个参数为负,则从字符串的结尾开始计数
    let str2 = "9876543210";
    let res2 = str2.slice(-9,-5); //返回8765
    str2.slice(-5); //返回43210
    str2.substr(-7,6); //返回654321 第二个参数不能为负,因为它定义的是长度
    

    提示:负值位置不适用 Internet Explorer 8 及其更早版本
    (7)replace() 方法用另一个值替换在字符串中指定的值。
    replace() 方法不会改变调用它的字符串。它返回的是新字符串。
    默认地,replace() 只替换首个匹配。
    默认地,replace() 对大小写敏感。

      let str = "abcABCabc"; 
      //请注意正则表达式不带引号
      str.replace(/ab/g,"xx"); //返回xxcABCxxc  如需替换所有匹配,请使用正则表达式的 g 标志(用于全局搜索)
      str.replace(/AB/i,"xx"); //返回xxcABCabc  如需执行大小写不敏感的替换,请使用正则表达式 /i(大小写不敏感)
      str.replace("AB","xx"); //返回abcxxCabc
    

    (8)toUpperCase() 把字符串转换为大写
    (9)toLowerCase() 把字符串转换为小写
    (10)concat() 连接两个或多个字符串(可用于代替加运算符)

    var text = "Hello" + "!" + "World!";
    var text = "Hello".concat("!","World!");
    

    (11)trim() 方法删除字符串两端的空白符

    //Internet Explorer 8 或更低版本不支持 trim() 方法
    //如需支持 IE 8,您可搭配正则表达式使用 replace() 方法代替
    let str = str = "       Hello World!        "
    str.trim()
    str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '')
    

    (12)charAt() 方法返回字符串中指定下标(位置)的字符串
    (13)charCodeAt() 方法返回字符串中指定索引的字符 unicode 编码.
    (14)ECMAScript 5 (2009) 允许对字符串的属性访问 [ ]

    使用属性访问有点不太靠谱:

    -不适用 Internet Explorer 7 或更早的版本
    -它让字符串看起来像是数组(其实并不是)
    -如果找不到字符,[ ] 返回 undefined,而 charAt() 返回空字符串。
    -它是只读的。str[0] = "A" 不会产生错误(但也不会工作!)

    var str = "HELLO WORLD";
    str[0];//返回 H
    str.charAt(0);// 返回 H
    str.charCodeAt(0);// 返回 72
    

    (15)split() 将字符串转换为数组。

    所有字符串方法都会返回新字符串。它们不会修改原始字符串,正式地说:字符串是不可变的:字符串不能更改,只能替换。

    2、数字

    JavaScript 只有一种数值类型,JavaScript 数值始终以双精度浮点数来存储,根据国际 IEEE 754 标准,JavaScript 数值始终是 64 位的浮点数。整数(不使用指数或科学计数法)会被精确到 15 位,小数的最大数是 17 位,但是浮点的算数并不总是 100% 精准(js计算时,会将十进制转换成二进制,再进行计算,但有些小数转换成二进制时候,出现了无限循环,由于位数有限,所以就出现了截取,所以就导致了再转化成十进制后结果的不精确.),可使用全局 JavaScript 函数 isNaN() 来确定某个值是否是数:

    let x = 999999999999999;   // x 将是 999999999999999
    let y = 9999999999999999;  // y 将是 10000000000000000
    let x = 0.2 + 0.1;         // x 将是 0.30000000000000004
    typeof NaN;  // 返回 "number"
    

    (1)Infinity (或 -Infinity)是 JavaScript 在计算数时超出最大可能数范围时返回的值。

    var x =  2 / 0;          // x 将是 Infinity
    var y = -2 / 0;          // y 将是 -Infinity
    

    (2)绝不要用前导零写数字(比如 07)。
    -一些 JavaScript 版本会把带有前导零的数解释为八进制。
    -默认地,Javascript 把数显示为十进制小数。
    -但是您能够使用 toString() 方法把数输出为十六进制、八进制或二进制
    -不要用new创建数字对象(会出现无法比较的问题)

    //二进制0b开头
    //八进制0开头
    //十六进制0x开头
    var myNumber = 128;
    myNumber.toString(16);     // 返回 80
    myNumber.toString(8);      // 返回 200
    myNumber.toString(2);      // 返回 10000000
    
    var x = new Number(500);             
    var y = new Number(500);
    x == y //返回false
    typeof x //返回object
    

    (3)toExponential() 返回字符串值,它包含已被四舍五入并使用指数计数法的数字 (参数定义小数点后的字符数)
    (4)toFixed() 返回字符串值,它包含了指定位数小数的数字
    (5)toPrecision() 返回字符串值,它包含了指定长度的数字

    var x = 9.656;
    x.toExponential(2);     // 返回 9.66e+0
    x.toExponential(4);     // 返回 9.6560e+0
    x.toExponential(6);     // 返回 9.656000e+0
    x.toFixed(0);           // 返回 10
    x.toFixed(2);           // 返回 9.66
    x.toFixed(4);           // 返回 9.6560
    x.toFixed(6);           // 返回 9.656000
    x.toPrecision();        // 返回 9.656
    x.toPrecision(1);        // 返回 1e+1 当参数大于等于整数位数时返回科学计数法表示
    x.toPrecision(2);       // 返回 9.7
    x.toPrecision(4);       // 返回 9.656
    x.toPrecision(6);       // 返回 9.65600
    

    (6)转换数字

    Number(true)//返回1
    Number(false)//返回0
    Number(new Date())//返回时间的getTime()值,即1970年到现在的毫秒数
    Number("10");Number("  10");Number("10  ");//返回10
    Number("10 20")//返回NaN
    Number(1.23e3);Number(1.23e+3);Number("1.23e3");Number("1.23e+3");//都返回1230
    Number("2018 year")//返回NaN
    Number("10,33")//返回NaN
    
    parseInt(true);parseInt(false);parseInt(new Date());//返回NaN
    parseInt("10");parseInt("  10");parseInt("10  ");//返回10
    parseInt("10 20")//返回10
    parseInt("1.23e+3");parseInt("1.23e3")//返回1
    parseInt(1.2345e3);parseInt(1.2345e+3);//返回1234
    parseInt("2018 year")//返回2018
    parseInt("10,33")//返回10
    
    number.toLocaleString('zh-Hans-CN-u-nu-hanidec') //将阿拉伯数字转换为中文
    
    image.png

    3、数组

    (1)pop() 从数组中删除最后一个元素并返回“被弹出”的值
    (2)push()(在数组结尾处)向数组添加一个新的元素并返回新数组的长度
    (3)join()将数组转换为字符串并规定分割符
    (4)shift() 方法会删除首个数组元素,并把所有其他元素“位移”到更低的索引并且返回被“位移出”的字符串。
    (5)unshift() 方法(在开头)向数组添加新元素,并“反向位移”旧元素并且返回新数组的长度

    let arr = ["a","b","c"]
    arr.push("d") //返回4 arr = ["a","b","c","d"]
    arr.pop() //返回"d" arr = ["a","b","c"]
    arr.join("$") // 返回 "a$b$c"
    arr.shift() //返回"a" arr=["b","c"]
    arr.unshift("z")//返回3 arr=["z","b","c"]
    

    (6)splice()可用于向数组添加新项(第一个参数(0)定义新元素应该被添加(接入)的位置;第二个参数(1)定义应该删除多个元素;其余参数则代表被插入的元素;)
    (7)concat()通过合并(连接)现有数组来创建一个新数组;concat() 方法不会更改现有数组。它总是返回一个新数组;可以使用任意数量的数组参数;
    (8)slice()用数组的某个片段切出新数组(该方法返回一个新数组,不会从源数组中删除任何元素。若传入两个数值参数该方法会从开始参数选取元素,直到结束参数(不包括)为止)

    let arr = [0,1,2,3]
    arr.splice(0,1); //arr = [1,2,3] 删除第一个元素
    arr.splice(1,1,4,5,6)//arr = [1,4,5,6,3]
    arr.concat(0,[1,2,3],4,5) //返回[1,4,5,6,3,0,1,2,3,4,5] arr = [1,4,5,6,3]
    arr.slice(1) //返回[4,5,6,3] arr还是原来的值
    arr.slice(1,2)//返回[5] 
    arr.slice(1,9)//返回[5,6,3]
    

    (9)sort()默认按照字母顺序对数组进行排序(若数组内的对象不是字符串,则将会把对象转换成字符串进行排序。sort可接收一个比值函数来进行排序,当 sort() 函数比较两个值时,会将值发送到比较函数,并根据所返回的值(负、零或正值)对这些值进行排序)
    (10)reverse()反转数组中的元素。并返回其自身

    let arr = [6,33,"abc","b"]
    arr.sort() //arr = [33,6,"abc","b"]
    
    let points = [40, 100, 1, 5, 25, 10];
    points.sort(function(a, b){return a - b});  //points = [1,5,10,25,40,100]
    points.sort(function(a, b){return 0.5 - Math.random()});  //以随机顺序排序数组
    Math.max.apply(null, arr) ;//返回数组中的最大值该函数的
    

    (11)forEach()为每个数组元素调用一次函数(回调函数),关于其他迭代方式https://www.jianshu.com/p/eb97c5aaff87
    (12)map()通过对每个数组元素执行函数来创建新数组(不会对没有值的数组元素执行函数,不会更改原始数组)
    (13)filter()过滤出符合条件的元素并返回一个包含这些元素的新数组

    let arr = [1,2,3,4,5,,7]
    let count = 0
    console.log(arr.length) //输出7
    arr.forEach(function(value,index,array) {
        count++
        console.log("value = "+value) //依次输出1-7对于没有值的元素不执行打印(谷歌浏览器)
    })
    console.log("count = "+count) //输出count = 6
    count = 0
    let arr1 = arr.map(function(value,index,array) {
            count++
        return value*2
    })
    console.log(arr1) //输出[2,4,6,8,10,empty,14]     arr依旧为原来的值
    console.log("count = "+count) //输出count = 6
    count = 0
    let arr3 = arr.filter(function(value,index,array) {
              count++
              return value > 3
    })
    console.log(arr3) //[4,5,7]
    console.log("count = "+count)//输出count = 6
    

    (14)reduce()在每个数组元素上运行函数,以生成(减少它)单个值
    (15)reduceRight()同reduce只是reduceRight的顺序为从右到左

    let count = 0
    let arr = [1,2,3,4,5]
    let totalNum = arr.reduce(function(total,value,index,array) {
          count++
          console.log("index = "+index + "total = "+total)//total第一次的值为数组第一个元素
          return total + value;
    })
    console.log("count = "+count) //count = 4
    

    (16)every()返回一个布尔值,代表调用的数组中的所有元素是否都满足条件
    (17)some()返回一个布尔值,代表调用的数组中的元素是否至少有一个满足条件

    let arr = [4,8,10,14]
    arr.every(function(value,index,array) {
        value > 9
    }) //返回false
    arr.some(function(value,index,array) {
        value > 9
    }) //返回true
    

    (18)find()方法返回通过测试函数的第一个数组元素的值
    (19)findIndex() 方法返回通过测试函数的第一个数组元素的索引
    (20)indexOf()在数组中搜索元素值并返回其位置(array.indexOf(item, start))
    item:必需。要检索的项目。
    start 可选。从哪里开始搜索。负值将从结尾开始的给定位置开始,并搜索到结尾。
    如果未找到项目 返回-1
    (21)lastIndexOf()与indexOf()相同不过方向是从后面往前搜索

    相关文章

      网友评论

          本文标题:javascript中常用的方法总结

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