【JavaScript高程总结】string(字符串)

1.字符串创建

var stringObject = new String("hello world");
//或者
var stringValue = "hello world";

str.length

Strin类型的每一个实例都有一个length属性,表示字符串中包含多少个字符


2.字符方法

这两个方法用于访问字符串中的特定字符

charAt()

接受一个参数及字符位置;

var stringValue = "hello world";
alert(stringValue.charAt(1));   //"e"

charCodeAt()

如果你想的得到的不是字符而是字符编码

var stringValue = "hello world";
alert(stringValue.charCodeAt(1)); //  "101"

101就是小写e的字符编码

ES5中定义的str[]方法也可以做到上面charAt()做到的事ie7以下版本可能不太行

var stringValue = "hello world";
alert(stringValue[1]);   //"e"

2.字符串操作方法

concat()(拼接字符串但是实践中一般是用“+”来拼接)

参数可以是多个,也就是可以拼接多个字符串

var stringValue = "hello ";
var result = stringValue.concat("world"); 
alert(result); //"hello world" 
alert(stringValue); //"hello"

下面三个方法都返回别操作字符串的一个子字符串,而且都接受一或两个参数
第一个参数:指定子字符串的开始位置
第二个参数:表示子字符串到哪里结束;slice()substring()这个参数表示结束的index;substr()表示个数(可选)

slice()

substr()

substring()

var stringValue = "hello world";
alert(stringValue.slice(3));  //"lo world"
alert(stringValue.substring(3));  //"lo world"
alert(stringValue.substr(3));   //"lo world" 
alert(stringValue.slice(3, 7));  //"lo w"
alert(stringValue.substring(3,7));//"lo w"
alert(stringValue.substr(3, 7)); //"lo worl"

参数出现负数
var stringValue = "hello world";
alert(stringValue.slice(-3));//"rld"
alert(stringValue.substring(-3));//"hello world"
alert(stringValue.substr(-3));//"rld"
alert(stringValue.slice(3, -4)); //"lo w"
alert(stringValue.substring(3, -4)); //"hel"
alert(stringValue.substr(3, -4)); //""(空字符串)


3.字符串位置方法

这两个都是从字符串中查找子字符串的方法
从一个字符串中搜索给定的子字符串;然后返回子字符串的位置(如果没找到该子字符串返回-1

indexOf()(从头开始查找)

lastIndexOf()(从末尾开始查找)

var stringValue = "hello world";
alert(stringValue.indexOf("o"));             //4
alert(stringValue.lastIndexOf("o"));         //7

可以接受第二个可选参数;
indexOf()会从该参数指定位置开始搜索忽略该参数指定位置之前的所有字符
lastIndexOf()则会从指定位置行前搜索忽略指定位置之后的所有字符

var stringValue = "hello world";
alert(stringValue.indexOf("o", 6));         //7
alert(stringValue.lastIndexOf("o", 6));     //4

因此你可以通过循环调用indexOf()或lastIndexOf()找到所有匹配字符;如下

var stringValue = "Lorem ipsum dolor sit amet, consectetur adipisicing elit"; var positions = new Array();
var pos = stringValue.indexOf("e");
while(pos > -1){
    positions.push(pos);
    pos = stringValue.indexOf("e", pos + 1);
}
alert(positions);    //"3,24,32,35,52"

4.去除字符串前后空格

trim()(更具被操控字符串创建一个字符串副本,删除前置及后缀的所有空格(不包括中间))

trimStart()(更具被操控字符串创建一个字符串副本,删除前置所有空格)

trimEnd()(更具被操控字符串创建一个字符串副本,删除后缀所有空格)

var stringValue = "   hello world   ";
var trimmedStringValue = stringValue.trim();
alert(stringValue);            //"   hello world   "
alert(trimmedStringValue);     //"hello world"
image.png

5.字符串大小写转换

一般情况下在不知道自己代码在那种语言环境运行,使用针对地区的方法稳妥些

toLowerCase()转换为小写(经典方法)

toLocaleLowerCase()转换为小写(针对地区的方法)

toUpperCase()转换为大写(经典方法)

toLocaleUpperCase()转换为大写(针对地区的方法)

var stringValue = "hello world";
alert(stringValue.toLocaleUpperCase());  //"HELLO WORLD"
alert(stringValue.toUpperCase());        //"HELLO WORLD"
alert(stringValue.toLocaleLowerCase());  //"hello world"
alert(stringValue.toLowerCase());        //"hello world"

6.字符串的模式匹配方法

match()

返回匹配到的第一个字符串以数组形式;
本质上与 RegExp的exec()方法相同;
接受一个参数正则表达式或RegExp对象

var text = "cat, bat, sat, fat";
var pattern = /.at/;
//与pattern.exec(text)相同  
var matches = text.match(pattern); 
alert(matches.index); //0 
alert(matches[0]); //"cat" 
alert(pattern.lastIndex); //0

search()

返回第一个匹配项的索引;
唯一参数与match()参数相同;没找到返回-1

var text = "cat, bat, sat, fat";
var pos = text.search(/at/);
alert(pos);   //1

replace()

接受两个参数
第一个RegExp对象或字符串
第二个字符串或函数
如果第一个参数是字符串那么只会替换一个字符串
要替换所有字符串为一份办法是提供正则表达式还要指定全局(g)

var text = "cat, bat, sat, fat";
var result = text.replace("at", "ond");
alert(result);    //"cond, bat, sat, fat"
result = text.replace(/at/g, "ond");
alert(result);    //"cond, bond, sond, fond"
image.png

第二个参数为函数
下面这个例子通过函数处理每一个匹配到的值如果是特殊符号就转义
一函数作为参数的重点就是清除函数默认参数都是什么

function htmlEscape(text){
    return text.replace(/[<>"&]/g, function(match, pos, originalText){
        switch(match){
            case "<":
                return "&lt;";
            case ">":
                return "&gt;";
            case "&":
                return "&amp;";
            case "\"":
                return "&quot;";
        } 
    });
}
    
alert(htmlEscape("<p class=\"greeting\">Hello world!</p>")); 
//输出:&lt;p class=&quot;greeting&quot;&gt;Hello world!&lt;/p&gt;

.split()

可将一个字符串通过指定参数分隔成多个字符串;返回数组(第二个参数规定返回数组的大小)

var colorText = "red,blue,green,yellow";
var colors1 = colorText.split(",");//["red", "blue", "green", "yellow"]
var colors2 = colorText.split(",", 2);  //["red", "blue"]
var colors3 = colorText.split(/[^\,]+/);  //["", ",", ",", ",", ""]

7.localeCompare()

localeCompare()

image.png
var stringValue = "yellow"; 
alert(stringValue.localeCompare("brick")); //1 
alert(stringValue.localeCompare("yellow")); //0 
alert(stringValue.localeCompare("zoo")); //-1
image.png
function determineOrder(value) {
    var result = stringValue.localeCompare(value);
    if (result < 0){
        alert("The string 'yellow' comes before the string '" + value + "'.");
    } else if (result > 0) {
        alert("The string 'yellow' comes after the string '" + value + "'.");
    } else {
        alert("The string 'yellow' is equal to the string '" + value + "'.");
    }
}
determineOrder("brick");
determineOrder("yellow");
determineOrder("zoo");

8.fromCharCode()

fromCharCode()

接受一或者多个字符编码将他们转换为字符串
本质上是执行charCodeAt()相反的操作

alert(String.fromCharCode(104, 101, 108, 108, 111)); //"hello"
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 195,585评论 5 462
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 82,283评论 2 373
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 142,760评论 0 324
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,461评论 1 266
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,280评论 4 357
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,268评论 1 273
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,656评论 3 385
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,322评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,629评论 1 293
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,691评论 2 312
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,445评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,299评论 3 313
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,694评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,982评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,244评论 1 251
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,642评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,829评论 2 335

推荐阅读更多精彩内容