数组对象和字符串对象

数组对象

数组类型检测    

代码示例：

        // 数组类型检测
        var arr = ['red']    // 创建数组
        var obj = { '颜色': 'red' }    // 创建对象

        console.log(arr instanceof Array);  // 判断 arr 是否是 Array 数组
        console.log(obj instanceof Object); // 判断 obj 是否是 Object 对象

运行结果：

 

数组对象常用方法：

数组的添加、删除

代码示例：

         /*
            push() 方法
            在数组末尾添加一个或多个元素
            返回值：添加元素后的数组长度
        */
        var arrlen = arr.push('yellow');
        console.log(arrlen);

        /*
             unshift() 方法
             在数组开头添加一个或多个元素
             返回值：添加元素后的数组长度
        */
        var arrlen = arr.unshift('颜色:');
        console.log(arrlen);

        /*
            pop() 方法
            删除数组的最后一个元素
            返回值：被删除的元素
            注意：若数组为空，则返回undefined
        */
        var arrpop = arr.pop();
        console.log(arrpop);

        /*
            shift() 方法
            删除数组的第一个元素
            返回值：被删除的元素
            注意：若数组为空，则返回undefined
        */
        var arrpop = arr.shift();
        console.log(arrpop);

        /*
             案例：筛选数组
             要求在包含工资的数组中，剔除工资达到2000或以上的数据，
             把小于2000的数放到新的数组，数组：[1500,1200,2000,2100,1800]
        */
        var arr = [1500, 1200, 2000, 2100, 1800];
        var newArr = []
        for (var i = 0; i < arr.length; i++) {
            if (arr[i] < 2000) {
                newArr.push(arr[i]);    // 相当于：newArr[newArr.length] = arr[i];
            }
        } console.log(newArr);

 运行结果：

 数组排序

代码示例：

        // 数组排序
        /*
            reverse() 方法
            颠倒数组中元素的位置
            返回值：颠倒位置后的数组
        */
        var arr = [1, 56, 99, 5, 45, 63, 27];
        console.log("原数组：" + arr);
        arr.reverse();  // 反转数组
        console.log("反转后的数组：" + arr);

        /*
            sort() 方法
            对数组的元素进行排序
            返回值：颠倒位置后的数组
        */
        arr.sort();
        console.log("arr.sort()默认排序后：" + arr);

        // a-b 升序
        arr.sort(function (a, b) {
            return a - b;
        });
        console.log("arr.sort(function(a,b){return a-b;}) 升序排序后：" + arr);

        // b-a 降序
        arr.sort(function (a, b) {
            return b - a;
        });
        console.log("arr.sort(function(a,b){return a-b;}) 降序排序后：" + arr);

运行结果：

 数组索引

代码示例：

        // 数组索引
        /*
            indexOf() 方法
            参数1：要查找的元素
            参数2：开始查找的下标位置
            *注意*：如果是负值，则从索引-1开始查找到参数2指定的负值位置
            找到指定的元素
            返回值：找到的第一个元素的下标
        */
        var arr = [1, 2, 3, 4, 5];
        console.log(arr.indexOf(2));
        console.log(arr.indexOf(2, -5));

        /*
             lastIndexOf() 方法
             参数1：要查找的元素
             参数2：开始查找的下标位置
             找到指定的元素最后一个的下标
             返回值：找到的第一个元素的下标
         */
        var arr = [1, 2, 3, 4, 5];
        console.log(arr.lastIndexOf(2));
        console.log(arr.lastIndexOf(2, -1));

        /*
             案例：数组去除重复元素
        */
        function unique(arr) {
            var newArr = [];
            for (var i = 0; i < arr.length; i++) {
                if (newArr.indexOf(arr[i]) === -1) {
                    newArr.push(arr[i]);
                }
            }
            return newArr;
        }
        var demo = unique([1, 2, 1]);
        console.log(demo);

运行结果：

 

数组转换为字符串

代码示例：

        // 数组转换为字符串
        /*
              toString() 方法
              把数组转换为字符串，逗号分隔每一项
              返回值：生成后的字符串
        */
        var arr = [1, 2, 3];
        console.log(arr.toString());

        /*
              join('分隔符') 方法
              把数组转换为字符串，逗号分隔每一项
              返回值：生成后的字符串
        */
        var arr = [1, 2, 3];
        console.log("默认逗号分隔arr.join()：" + arr.join());
        console.log("不用分隔符arr.join('')：" + arr.join(''));
        console.log("用-分隔arr.join('-')：" + arr.join('-'));

运行结果：

 

其他方法

代码示例：

        /*
              fill(value,start,end) 方法
              用一个固定值填充数组中指定下表范围内的全部元素,返回修改后的数组
              参数：
              value 用于填充的字符
              start 开始填充的索引
              end   结束填充的索引 (替换范围不包含end)
        */
        // 定义数组
        var arr = [1, 2, 3, 4, 5]

        // fill(value)
        console.log("fill(value)填充前:" + arr);
        arr.fill('*')
        console.log("fill('*')填充后：" + arr);

        // fill(value,start)
        console.log("fill(value,start)填充前:" + arr);
        arr.fill('*', 2)
        console.log("fill('*', 2)填充后：" + arr);

        // fill(value,start,end)
        console.log("fill(value,start,end)填充前:" + arr);
        arr.fill('*', 2, 4)
        console.log("fill('*', 2, 4)填充后：" + arr);


        /*
            splice(start,deleteCount,item1,...,itemN) 方法
            数组删除元素,返回修改后的新数组
            参数：
            start：第几个开始
            deleteCount：要删除的个数
            item1,...,itemN：要添加进数组的元素
        */
        // 定义数组
        var arr = [1, 2, 3, 4, 5]

        // splice(start)
        console.log("splice(start)删除前："+arr);
        arr.splice(2);
        console.log("splice(2)删除后："+arr);

        // splice(start, deleteCount)
        console.log("splice(start, deleteCount)删除前："+arr);
        arr.splice(2,1);
        console.log("splice(2, 1)删除后："+arr);

        // splice(start, deleteCount, item1)
        console.log("splice(start, deleteCount, item1)删除前："+arr);
        arr.splice(2,1,6);
        console.log("splice(2, 1, 6)删除后："+arr);

        // splice(start, deleteCount, item1, item2, itemN)
        console.log("splice(start, deleteCount, item1, item2, itemN)删除前："+arr);
        arr.splice(2,1,6,7);
        console.log("splice(2, 1, 6, 7)删除后："+arr);


        /*
            slice(start, end) 方法
            数组截取，返回被截取项目的新数组
            参数：
            start：开始截取处的索引
            end：提取终止处的索引
            注意：截取元素不包括end
        */
       // 定义数组
       var arr = [1, 2, 3, 4, 5]
        
        // slice()
        console.log("slice()截取全部元素："+arr.slice());

        // slice(start)
        console.log("slice(start)截取前："+arr);
        console.log("slice(2)截取后："+arr.slice(2));

        // slice(start, end) 不包括end
        console.log("slice(start)截取前："+arr);
        console.log("slice(2,4)截取后："+arr.slice(2,4));


        /*
            concat(valueN) 方法
            连接两个或多个数组，不影响原数组，返回一个新数组
            参数：
            valueN：数组
        */
        // 定义数组 
        var arr1= ['a', 'b', 'c'];
        var arr2 = ['d', 'e', 'f'];

        // concat() 
        console.log("arr1.concat()后的新数组："+arr1.concat());

        // concat(value0)
        console.log("arr1.concat(arr2)后的新数组："+arr1.concat(arr2));

运行结果：

 

字符串对象

创建字符串对象

代码示例：

        /*
            创建字符串对象
        */
        var objStr = new String('apple');
        console.log(typeof objStr);             // object
        console.log(objStr.length);             // 5
        console.log(objStr instanceof String);  // true

        /*
            注意：var str = 'apple';
            此时str是字符串类型的数据，而不是字符串对象
        */
        var str = 'apple';
        console.log(typeof str);                // string
        console.log(str.length);                // 5
        console.log(str instanceof String);     // false

运行结果：

 

根据字符返回位置

代码示例：

        /*
            indexOf(searchString) 方法
            获取searchString在字符串中首次出现的位置
            参数：
                searchString：要查找的字符
        */
        var str = 'Hello World';
        console.log("str：" + str);
        console.log("str.indexOf('W')：" + str.indexOf('W'));  // 6

        /*
            lastIndexOf(searchString) 方法
            获取searchString在字符串中最后出现的位置
            参数：
                searchString：要查找的字符
        */
        var str = 'Hello World W';
        console.log("str：" + str);
        console.log("str.lastIndexOf('W')：" + str.lastIndexOf('W'));  // 12

运行结果：

 

根据位置返回字符

代码示例：

         /*
            charAt(index) 方法
            获取index位置的字符，位置从0开始计算
            参数：
                index：要查找的索引位置
        */
        var str = 'Hello World';
        console.log("str：" + str);
        console.log("str.charAt(5)：" + str.charAt(4));   // O

        /*
            charCodeAt(index) 方法
            获取index位置的字符的ASCII码
            参数：
                index：要查找的索引位置
        */
        var str = 'Hello World';
        console.log("str：" + str);
        console.log("str.charCodeAt(4)：" + str.charCodeAt(4));   // 111

        /*
            str[index] 方法
            获取指定位置的字符
            参数：
                index：要查找的索引位置
        */
        var str = 'Hello World';
        console.log("str：" + str);
        console.log("str[0]：" + str[0]);   // H

        /*
            案例：统计出现最多的字符和次数
        */
        var strNum = 'Apple';
        // 创建一个空对象，统计每个字符出现的次数
        var obj = {};
        for (var i = 0; i < strNum.length; i++) {
            var chars = strNum.charAt(i);  // 利用chars保存字符串中的每一个字符
            // 判断属性有无值
            if (obj[chars]) {
                obj[chars]++;   // 有则自增
            } else {
                obj[chars] = 1; // 没有赋值为1
            }
        }
        console.log(obj);
        var max = 0;       // 出现最多的次数
        var ch = '';        // 出现最多的字符
        for (var k in obj) {
            if (obj[k] > max) {
                max = obj[k];
                ch = k;
            }
        }
        console.log('出现最多的字符是：' + ch + '，共出现了' + max + '次');

运行结果：

 

字符串操作方法

代码示例：

        /*
            str.concat(str2, [, ...strN]) 方法
            将一个或多个字符串与原字符串连接合并，形成一个新的字符串并返回。
            参数：需要连接到 str 的字符串
        */
        var str = '123';
        var str2 = '456';
        console.log("str：" + str + "，str2：" + str2);
        console.log("str.concat(str2)：" + str.concat(str2));

        /*
            slice(beginIndex[, endIndex]) 方法
            提取某个字符串的一部分，并返回一个新的字符串，且不会改动原字符串。
            参数：
                beginIndex：开始索引
                endIndex：结束索引
        */
        var str = '123456789';

        //  slice(beginIndex）
        console.log("str：" + str);
        console.log("str.slice(2)：" + str.slice(2));

        // slice(beginIndex, endIndex) 不包括endIndex
        console.log("str：" + str);
        console.log("str.slice(2,5)：" + str.slice(2, 5));

        /*
            substring(indexStart[, indexEnd]) 方法
            返回一个字符串在开始索引到结束索引之间的一个子集，
            或从开始索引直到字符串的末尾的一个子集。
            参数：
                indexStart：开始索引
                indexEnd：结束索引
            注意：substring方法参数不接收负值
        */
        var str = '123456789';

        // substring(indexStart)     
        console.log("str：" + str);
        console.log("str.substring(2)：" + str.substring(2));

        // substring(indexStart, indexEnd) 不包括indexEnd
        console.log("str：" + str);
        console.log("str.substring(5,8)：" + str.substring(5, 8));

        /*
            substr(start[, length]) 方法
            返回一个字符串中从指定位置开始到指定字符数的字符
            参数：
                start：开始索引
                length：截取长度
            mdn警告：尽管 String.prototype.substr(…) 没有严格被废弃 (as in "removed from the Web standards"), 
                    但它被认作是遗留的函数并且可以的话应该避免使用。
                    它并非 JavaScript 核心语言的一部分，未来将可能会被移除掉。
                    如果可以的话，使用 substring() 替代它。
        */
        var str = '123456789';

        // substr(start)
        console.log("str：" + str);
        console.log("str.substr(2)：" + str.substr(2));

        // substr(start, length)
        console.log("str：" + str);
        console.log("str.substr(5,8)：" + str.substr(5, 8));

        /*
            toLowerCase() 方法
            会将调用该方法的字符串值转为小写形式，并返回。
        */
        var str = 'ABCDEFG';
        console.log("str：" + str);
        console.log("str.toLowerCase()：" + str.toLowerCase());

        /*
             toUpperCase() 方法
             会将调用该方法的字符串值转为小写形式，并返回。
         */
        var str = 'abcdefg';
        console.log("str：" + str);
        console.log("str.toUpperCase()：" + str.toUpperCase());

        /*
             split([separator[, limit]]) 方法
             使用指定的分隔符字符串将一个String对象分割成子字符串数组，
             以一个指定的分割字串来决定每个拆分的位置。
             参数：
                 separator：分隔符
                 limit：分割片段数量
            mdn警告： 如果使用空字符串 (“) 作为分隔符，则字符串不是在每个用户感知的字符 (图形素集群) 之间，
                     也不是在每个 Unicode 字符 (代码点) 之间，而是在每个 UTF-16 代码单元之间。这会摧毁代理对。
                     还请参见how do you get a string to a character array in javascript
        */
        var str = "1-2-3-4-5-6";

        // split()
        console.log("str：" + str);
        console.log("str.split()不指定分隔符：" + str.split());

        // split(separator)
        console.log("str：" + str);
        console.log("str.split('-')：" + str.split('-'));

        // split(separator, limit)
        console.log("str：" + str);
        console.log("str.split('-',3)：" + str.split('-', 3));


        /*
            replace(regexp|substr, newSubStr|function) 方法
            返回一个由替换值（replacement）替换部分
            或所有的模式（pattern）匹配项后的新字符串。
            模式可以是一个字符串或者一个正则表达式，
            替换值可以是一个字符串或者一个每次匹配都要调用的回调函数。
            如果pattern是字符串，则仅替换第一个匹配项。

        */
        var str = '123456';

        // replace(regexp|substr, newSubStr|function)
        console.log("str：" + str);
        console.log("str.replace('456','***')：" + str.replace('456', '***'));


        /*
            案例：判断用户名是否合法
            要求：用户名长度在3~10范围内，不允许敏感词admin的任何大小写形式
        */
        var name = prompt('请输入用户名：');
        if (name.length < 3 || name.length > 10) {
            alert('用户名长度必须在3~10范围内。');
        } else if (name.toLowerCase().indexOf('admin') != -1) {
            alert('用户名中不能包含敏感词：admin');
        } else {
            alert('恭喜您，用户名可以使用！');
        }

运行结果：

 

字符串处理小练习

代码示例：

 

        /*
            小练习：处理url
            url = 'https://www.baidu.com/login?name=yezhen&age=20';
            输出：｛name:zs;age:20｝
        */
        var url = 'https://www.baidu.com/login?name=yezhen&age=20';
        var index = url.indexOf('?');
        url = url.substring(index+1);
        url = url.replace('=',':');
        url = url.replace('&',';');
        console.log('{' + url + '}')

运行结果：