前端 js 中 字符串方法和函数简介

Math的常用方法

    Math.floor() 向下取整

    Math.ceil()  向上取整

    Math.round()   四舍五入

    Math.random()  随机数

    Math.pow(底数，幂)  幂运算

    Math.sqrt(16);  算术平方根

    Math.abs(-16);  绝对值

    Math.min(num1,mun2....) 取最小值

    Math.max(num1,mun2....) 取最大值

    Math.PI 圆周率

    Math.sin() 正弦函数

    Math.cos() 余弦函数

// 幂
    let n = Math.pow(2,4); //2的4次方
    console.log(n);
    //算术平方根
    let n1 = Math.sqrt(16);
    console.log(n1);
    //绝对值
    let n2 = Math.abs(-16);
    console.log(n2);
    //最小值
    let n3 = Math.min(23,12,3,5,);
    console.log(n3);
    //最大值
    let n4 = Math.max(23,12,4,32,2);
    console.log(n4);

获取数组最小值，最大值的方法

    Math.max.apply(null,arr)  apply的作用是 把数组直接转化为用逗号隔开的参数，并且传递给min()立即执行

 let arr = [23,323,44,543234,5,32,543];
    let n5 = Math.max.apply(null,arr);//最大
    console.log('最大'+n5);
    let n6 = Math.min.apply(null,arr);//最小
    console.log('最小'+n6);
    //扩展运算符
    let n7 = Math.min(...arr);
    console.log(n7);

    console.log(Math.PI);//圆周率 π
    //正弦函数
    let num3 = Math.sin( Math.PI/6);
    console.log(num3);
    // 余弦函数
    let num4 = Math.cos( Math.PI/6);
    console.log(num4);

以上代码运行的结果是

 

字符串方法

 charAt(num) 获取字符串指定位置上的字符

    参数是 设置的索引，从0 开始，不支持负数,如果参数不存在或者不合法，默认为0，返回值是指定位置的字符

let str1 = '邓超孙俪';
    let n = str1.charAt(2);
    console.log(n);
    let n2 = str1.charAt();
    console.log(n2);

字符串也可以for循环，获取字符串的长度，使用 length 属性 str.length

 let str2 = '蜀道之难难于上青天';
    for(let i=0;i<str2.length;i++){
        console.log(str2[i]);
    }
    console.log(str2.length);

字符串的截取

    substring()

    参数有两个

    参数1  表示 开始截取的位置

    参数2  表示 结束截取的位置

    返回截取的字符串，包含开始位置，不包含结束位置

    特点：

    1.如果参数省略，则提取整个字符串，可以理解为复制

    2.如果只有一个参数，则表示从该位置截取到最后

    3.如果有两个参数，截取的结果，包含开始位置，不包含结束位置

    4.如果有两个参数，首先比较两个参数的大小，小数在前为开始位置，大数在后为结束位置

let str3 = str2.substring(2,5);
    console.log(str3);

    // let str4 = str2.substring();
    let str4 = str2.substring(2);
    console.log(str4);

    let str5 = '一片两片三四片';
    let str6 = str5.substring(5,2);
    console.log(str6);

 slice() 和数组一样，字符串也有slice方法

    特性和数组完全一样

    参数是两个

    参数1 开始截取的下标位置

    参数2 结束截取的下标位置

    特点；

    1.截取的时候，必须保证开始位置在结束位置之前，否则截取为空

    2.参数必须是正整数、负整数或者0，其他非法字符都被解析为0

    3.如果不写结束位置，则直接截取到最后

    4.如果没有参数，则提取整个字符串，可以理解为复制

    5.如果参数为负数，则表示从后面开始计算，从-1开始

 let str7 = str5.slice(2,5);
    console.log(str7);

    let str8 = str5.slice(2,-2);
    console.log(str8);

    let str9 = '晋太元中,武陵人捕鱼为业。缘溪行,忘路之远近。忽逢桃花林,夹岸数百步,中无杂树,芳草鲜美,落英缤纷。渔人甚异之。复前行,欲穷其林。';
    let str11 =str9.substring(0,11)+'...';
    console.log(str11);
    let tel = '18888888889';
    let tel1 = tel.substring(0,3)+'****'+tel.substring(7);
    console.log(tel1);

substr()

    参数 两个

    参数1 开始截取的位置

    参数2 截取的长度

    特点：

    1.参数1 可以是正整数 负整数 和0

    2.截取的字符串包含第一个位置

    3.ie低版本中， 第一个参数不能使用负数

    4.不是一个标准方法，因此不是所有的浏览器都兼容

let str13 = '种豆南山下草盛豆苗稀';
    let str14 = str13.substr(2,2);  //南山
    console.log(str14);

    let str15 = str13.substr(-2,2);//苗稀，从-2位置开始往后数
    console.log(str15);

以上代码运行结果如下

 

 

indexOf()

    lastindexOf()

    两个参数

    参数1 是 要查找的字符串

    参数2 是 开始查找的位置

    特点和数组中一模一样，找不到返回-1

let str1 = '一片两片三四片';
    let n = str1.indexOf('片');
    console.log(n); //1
    let n2 = str1.lastIndexOf('片');
    console.log(n2); //6

 字符转化

    toUpperCase() 小写转大写

    toLowerCase() 大写转小写

    不需要参数

let str2 = 'Hello Zhengke!';
    let str3 = str2.toUpperCase();
    console.log(str3);//小写转大写

    let str4 = str2.toLowerCase();
    console.log(str4);//大写转小写

trim() 去掉字符串 两边 的空格 (字之间的空格去不掉)

    1.不需要设置参数

    2.新方法，低版本ie不支持

btn.onclick = function(){
        let val = txt.value.trim();
        alert(`@${val}@`)
    }

    let str5 = '             中午吃啥          ';
    console.log(`&${str5.trim()}&`);

 字符串拼接

    concat() 方法 和 数组方法一样，嗾使拼接，参数可以设置多个

    通常使用 + 左字符串拼接

let str6 = '三国演义';
    let str7 = '水浒城';

    let str8 = str6.concat(str7);
    console.log(str8);

字符串转化为数组

    split('分隔符')

 let str9 = '一片两片三四片';
    let arr1 = str9.split('');
    console.log(arr1);
    let arr2 = str9.split('片');
    console.log(arr2);

字符串查找和替换，将在正则中分享

    search()

    match()

    replace()

字符串

以上代码运行效果如下

 

函数

    把一段具有一定功能的代码封装起来，在使用的时候方便运行在代码上下文的各个地方

函数的分类

    自定义函数

        函数名，函数名区分大小写，函数的命名规则和变量的命名规则相同

        声明函数的语法(关键字是 function)

        function 函数名(参数1,参数2,....){

            函数中的操作代码

            return 返回值

        }

        函数在定义的时候，所有的参数都是形参

        在函数调用的时候，所有的参数都是实参

    库函数

当函数在定义的时候，写在函数内部的代码不会立即执行，只有当函数调用的时候，函数中的代码才会执行

let n = 0;
    show();  //执行函数(调用)
    function show(){
        n++;
        console.log('龙游浅水招虾戏'+n);
    }

    //有参数的函数
    sum(5,6);
    function sum(m,n){
        console.log(m+n);
    }
    sum('葡萄美酒','夜光杯');

函数的返回值

    return 关键字，用来返回一个值

    1.返回值可以是任意类型

    2.写在return 后面的代码，不会被执行

    3.如果一个函数没有return，则默认值是undefined

    4.如果想要返回多个值，则可以通过 返回数组或对象的形式返回数据

//没有参数，有返回值
    function abc(){
        console.log('画虎画皮难画骨');
        wp.style = `
            width:200px;
            height:200px;
            background:#04be02;
            `
    }
    abc();

    //没有参数，没有返回值
    function run(){
        let m = 10;
        let n = 20;
        return m+n;  //break
        console.log('你永远看不见我');
    }

    //函数的返回值，最好赋值在一个变量上
    let hh = run();
    console.log(run(),hh);

    //函数可以返回任意类型的数据
    //有参数 有返回值
    function anyFun(m,n,c){
        return [m,n,c]; //返回一个数组
    }
    let arr = anyFun('程咬金','程咬银','程咬铜');
    console.log(arr);

    //返回一个对象
    function $(id){
        return document.getElementById(id);
    }
    $('wp').onclick = function(){
        alert('函数真好用');
    }

    //封装一个 [m,n]的随机整数的函数
    function rand(m,n){
        return Math.floor(Math.random()*n-m+1)+m;
    }
    console.log(rand(20,100));
    //没有返回值 返回的是undefined
    function noReturn(){
        console.log('加油奥利给');
        return false;
    }
    let str = noReturn();
    console.log(str);

    //返回多个值
    function anyReturn(){
        let user = '魏忠贤';
        let arr = ['李莲英','郑和','赵高','王振'];
        let num = 9000;

        return [user,arr,num];
    }
    console.log(anyReturn());