前端从0单排之JS------Day11笔记

最新推荐文章于 2024-09-01 21:50:14 发布

卖水果的陈柳鹏

最新推荐文章于 2024-09-01 21:50:14 发布

阅读量118

点赞数

本文链接：https://blog.csdn.net/qq_40890095/article/details/100082241

版权

JS中关于字符串的一些细节知识

在JS中所有用单引号或者双引号抱起来的都是字符串，每一字符串是由零到多个字符组成


var str = 'tail';

str.length //  字符串长度

str[0]; // 't'
str[str.lenght-1]; // 'l'
str[100]; // undefined
// 字符串中的每一个字符都有一个自己对应位置的索引，也有类似数组一样的length代表自己的长度
for(var i = 0; i<str.length;i++) {
    console.log(str[i]);
};

关于字符串中常用的方法

字符串是基本数据类型，字符串的每一次操作都是值直接的进行操作，不像数组一样是基于空间地址来操作的，所以不存在原有字符串是否改变一说，肯定都是不变的

** charAt / charCodeAt **

作用：
charAt根据索引获取指定位置的字符，
charCodeAt不仅仅获取字符，它获取的是字符对应的Unicode编码（ASC II）

参数：索引

返回：字符或者对那个的编码

和直接操作索引方式获取的区别：
当索引不存在的时候，str[n]获取的结果是undefined，运行的机制和对象一样，而charAt（n）获取的结果是空字符串

var str = 'tail';
str.charCodeAt(0)
116
String.formCharCode(116);
't'

** indexOf / lastIndexOf **

基于这两个方法，可以获取字符在字符串中第一次或者最后一次出现位置的索引，有这个字符，返回大于等于零的索引，不包含这个字符，返回的结果是-1，所以可以基于这两个方法，验证当前字符串中是否包含某个字符

** slice **

作用： str.slice(n,m) 从索引n开始找到索引为m处（不包含m），把找到的字符当作新字符串返回

** substring **

和slice语法一模一样，唯一的区别在于：slice支持负数索引，而substring不支持负数索引

** substr **

也是字符串截取的方法
用法是：str.substr(n,m),从索引n开始截取m个字符，支持负数索引

** toUpperCase / toLowerCase **

实现字母的大小写转换，toUpperCase 小写转大写，toLowerCase 大写转小写

** split **
和数组中的join相对应，数组中的join是把数组们一项按照指定的分隔符，拆分成数组中的每一项

** replace **
作用：替换字符串中的原有字符
参数：原有字符，要替换的新字符
返回：替换后的字符串


var str = 'tailtail';

str = str.replace('l','1');

在不适用正则的情况下，每执行一次replace 只能替换一个

str = str.replace(/l/g,'2');

真是项目中的需求

时间字符串格式化

有一个时间字符串“2019-8-26 16：26：8”，我们想基于这个字符串获取到“08月26日 16时26分”


function addZero(val) {
    return val<10 ? '0' + val : val;
}


var str = '2019-8-26 16:32:8'


var ary = str.split(' '),
    aryLeft = ary[0].split('-'),
    aryRight = ary[1].split(':');
var month = addZero(aryLeft[1]);
    day = addZero(aryLeft[2]);
    hour = addZero(aryRight[0]);
    minute = addZero(aryRight[1]);
var result = month + '月' +  day + '日' + hour + '时' + minute + '分'
console.log(result)

// str.split(/(?:-| |:)/g)

~function (pro){
    pro.formatTime = function (template){
        template = template || '{0}年{1}月{2}日 {3}时{4}分{5}秒'
        var ary = this.match(/\d+/g);
        template = template.replace(/\{(\d+)}\/g,function(){
            var n = arguments[1],
                val = ary[n] || '0';
            val < 10 ? val = '0' + val :null;
            return val;
        });
        return template;
    }
}(String.prototype)

str.formatTime();
str.formatTime('{1}月{2}日 {3}时{4}分')

URL地址问号传参解析

~function(pro) {
    pro.queryURLParameter = function() {
        var obj = {},
            reg = /([^?=&#]+)(?:=?([^?=&#]+)?)?/g;
        this.replace(reg,function(){
            var key = arguments[1],
                value = arguments[2] || null;
            obj[key] = value;

        });
        return obj
    }
}(String.prototype);

var str = "www.baidu.com?x=121&y=231#type=21"
str.queryURLParameter();


// =>
{
   type: "21"
    www.baidu.com: null
    x: "121"
    y: "231"
}