字符串API与数组API实例演示 -

字符串API实例演示

代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>字符串与数组API实例演示</title>
</head>
<body>
    <script>
        // 创建字符串
        let str = '我是中国人';
        // 长度
        console.log(str.length);
        //根据索引获取字符串
        console.log(str[1]);
        console.log(str.charAt(2));
        // 查询字符串索引
        console.log(str.indexOf('中'));
        console.log(str.search('国'));
        // 字符串连接
        console.log(str + 'baidu.com');
        console.log(`${str}baidu.com`);
        // 字符串替换
        console.log(str.replace('中国人', '.cn'));
        // 取子串
        // slice 取子串,忽略结束索引对应的值
        console.log(str.slice(0, 3));
        // substr: 不知到哪结束,但是知道取多少
        console.log(str.substr(0, 4));
        // 字符串转数组
        let s = '1-2-3-4-5';
        console.log(s.split('-'));
        console.log(str.split('', 4));
        // 大小写转换
        // toLowerCase,toUpperCase
        let a='myDream';
        console.log(a.toUpperCase());
        console.log(a.toLowerCase());
        // html标签相关
        console.log(str.link('https://baidu.com'));
        document.body.insertAdjacentHTML('afterbegin', str.link('https://baidu.com'));
    </script>
</body>
</html>

控制台效果如下：

数组API实例

代码如下：

 <script>
    // 遍历数组
        // 1. forEach,map
        // 2. every, some
        // 3. filter, find, findIndex
        // 4. reduce
        let arr = [1, 2, 3, 4, 5];
        // arr.forEach(function(元素的值,值对应的索引,数组本身) {
        // 对数组中的每个元素逐个调用回调方式进行处理
        // })
        let res = arr.forEach((item, index, arr) => console.log(item, index, arr));
        // 需要返回值,就用map
        res = arr.map((item, index, arr) => [item, index, arr]);
        // every, some
        // every: 数组成员全部满足条件,则返回 true , 否则 false 与
        console.log(arr.every(item => item >= 0));
        console.log(arr.some(item => item >= 6));
        // filter,只返回为真的元素组成的数组
        console.log(arr.filter(item => item >= 3));
        // find,返回满足条件的第一个
        // arr.filter(item => item >= 3)[0]
        console.log(arr.find(item => item >= 3));
        // 归并 reduce
        // arr.reduce(function(累加器,元素的值,值对应的索引,数组本身) {})
        res = arr.reduce(function (acc, item, index, arr) {
            console.log(`acc=${acc}, item=${item}`);
            return acc + item;
        }, 1000);
    </script>

控制台效果如下：