JavaScript高级程序设计 --- 引用类型

引用类型是一种数据结构,将数据和功能组织在一起。引用类型的值便是引用类型的一个实例。

Object类型

创建Object对象
  • 使用new关键字进行创建
var Person = new Object();
Person.name="zhiyao";
Person.age=29;
  • 使用对象字面量进行创建(对象字面量创建时一种简单的写法,目的在于简化对象创建大量对象的过程)
var person = {
    name:"zhiyao",
    age:29
}
访问object属性
  • 使用点表示法
var personName = Person.name;
  • 使用方括号表示法
var personName = person[name];

一般在访问对象的属性时,大多数语言提供的都是点访问法。在js中的方括号表示法相比于点表示法,优点在于可以通过变量访问属性。

var nameProp = 'name';
var personName = Person[nameProp]

Array类型

Array类型与其他语言不同的地方在于在js中的数组类型可以存放任何数据类型的数据。在一个数组中可以第一个存放字符型、第二个存放数值型等等
创建Array对象
  • 使用Array构造函数创建
var personArr = new Array(20);
var personArr = new Array('July' , 'Lily' , 'Gray');
  • 使用数组字面量创建
var personArr = ['July' , 'Lily' , 'Gray'];
访问数组中的值
  • 通过下标位置进行访问
var name = personArr[2]; //输出Gray
获取数组的长度
  • length属性
var srrLen = personArr.length;
  • length属性的特点
    length属性不是一个只读属性,通过length可以对数组进行操作。可以添加新项,移除末尾项,改变数组长度等
var personArr = ['July' , 'Lily' , 'Gray'];
personArr.length = 2;
alert(personArr[2]);//输出undefined,移除了最后一项
personArr.length = 4;
alert(personArr[3]);//输出undefined,添加了一项
personArr[99] = 'jenny';
personArr.length = 100;//长度为100
检测数组
  • instanceof 关键字
alert( value instanceof Array);
  • Array.isArray(value) 推荐使用

isArray函数可以检测多个全局环境中的数组。支持的浏览器为IE9+、Firefox4+、safari5+、Opera10.5和chrome

转换方法

所有的对象都具有toLocalString()、toString()和valueof()

  • 将数组转换为字符串
arr.valueof();//使用valueof返回的依旧是数组本身输出July , Lily, Gray
arr.toString();//调用每一项的toString方法输出
arr.toLacolString();//调用每一项的toLocalString方法输出
  • join()//修改字符串当中的分隔符
var arr = ['July' , 'Lily' , 'Gray'];
arr.join("&");//输出 July&Lily&Gray
栈方法

栈是一种后进先出(LIFO)的数据结构,最新添加的项最早被移除。在栈中只有一个地方对发生变化-栈的顶端。Array对象内置push()和pop()方法,以便实现栈的结构。

  • push()
    push方法可以接受任意个数的数据,按照次序逐个插入到数组中,并返回当前数组的长度。

  • pop()
    pop方法移除掉数组的最后一项,并返回被移除项的值。

队列方法

队列方法是一种后进后出(LILO)的数据结构,即最新添加的数据最后移除。在对尾和对首都会发生数据的变化。Array对象内置shift()函数配合push()使用,实现队列效果。

  • shift()
    shift函数能够移除队列顶端的数据,并返回被移除项的值

  • unshift()
    unshift的作用与shift的作用相反,在队列的首段添加数据

重排序方法

数组中内置两个函数实现排序效果 reverse()和 sort()

  • reverse()
    reverse函数实现数组的反置,返回反置后的数组数据
var arr=[1,2,3,4,5];
arr.reverse();
alert(arr);//5,4,3,2,1
  • sort()
    sort方法默认进行的是升序排序,即最小的值放在数组前面,最大的值放在数组后面。sort函数在进行排序时,会先取得数组中的每一项数据,对数据执行toString()函数后,在对每一项数据进行对比.
var arr=[1,12,13,4,5];
arr.sort();
alert(arr);//1,12,13,4,5,虽然12比5大,但是进行字符串比较时12在5前面

在大多数情况下并不想得到字符串类型的对比结果,所以直接使用sort方法并不是最优选择。可以对sort函数进行改进。传入一个compare函数作为对比参数

//说明:compare函数支持两个参数,升序排序
//如果返回的函数是负数,则第一个数放在第二个数的前面。
//如果返回的数是正数,则第一个值放在第二个值的后面。
//如果相等,则返回0
function compare(value1 , value2){
    if(value1 < value2){
        return -1;
    }else if(value1 > value2){
        return 1;
    }else{
        return 0;
    }
}
var arr = [1,2,12,23,4];
arr.sort(compare);
alert(arr);//1,2,4,12,23

说明:如果想要降序排序,在小于的时候返回正数,大于的时候返回负数即可

function compare(value1 , value2){
    if(value1 < value2){
        return 1;
    }else if(value1 > value2){
        return -1;
    }else{
        return 0;
    }
}

说明2:如果是数值类型或者valueof返回值为数值类型的对象,升序排序的比较函数可以直接简化为:

function compare(value1 , value2){
    return value1-value2;//升序排序
}
对数组内容的操作方法

array 内置了concat()、slice(),splice()函数等,可以对数组内容进行操作

  • concat()
    concat()函数用于基于当前数组创建一个新的数组。concat函数接收的参数放于数组的最后
var colors = ["red", "green", "blue"];
var colors2 = colors.concat("yellow", ["black", "brown"]);
alert(colors);     //red,green,blue,不会影响原函数
alert(colors2);    //red,green,blue,yellow,black,brown,分别将两个数放到了尾部

说明:如果没有传递参数,则只是相当于生成了原数组的一个副本。

  • slice() 数组截取函数
    slice(starIndex , endIndex)函数接收两个参数,第一个参数是开始的位置,第二个是结束位置的项(不包括最后一项),如果第二个参数为空则直接截取到数组的最后一个。返回的为数组。
var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);
var colors3 = colors.slice(1,4);
alert(colors);//"red", "green", "blue", "yellow", "purple"
alert(colors2);//green,blue,yellow,purple
alert(colors3);//green,blue,yellow

说明:slice函数不会影响原函数
说明2:如果slice参数中含有负数,则转换为参数加长度之后的值,如果起始值大于结束值则返回一个空数组。

  • splice()函数 对数组内容进行添加、删除、修改的函数
    删除操作:splice函数接收两个参数,第一个为开始的位置,第二个为删除的个数。
var colors = ["red", "green", "blue"];
var removed = colors.splice(0,1); //remove the first item
alert(colors); //green,blue
alert(removed);//red - one item array
//splice是对原来的数组进行操作,影响原数组,并返回包含被删除项的数组

添加操作:splice(开始的位置,删除的个数,添加的内容);

removed = colors.splice(1, 0, "yellow", "orange");  //insert two items at 
alert(colors);//green,yellow,orange,blue
alert(removed);//empty array

如果删除的个数为0,则返回一个空数组。
修改操作:splice(开始的位置,删除的个数,修改的内容)

removed = colors.splice(1, 1, "red", "purple");//insert two values, remove one
alert(colors);     //green,red,purple,orange,blue
alert(removed);    //yellow - one item array
位置方法

数组内置了两种获取位置的方法:indexOf()和lastIndexOf()

  • indexOf(value , startIndex) 获取值在数组中的位置,第一个参数为要检索的值,第二个参数为可选值,表示起始的位置。
  • lastIndexOf(value , startIndex) 从后向前检索值在数组中的位置,参数含义和indexOf一致
var numbers = [1,2,3,4,5,4,3,2,1];
alert(numbers.indexOf(4));        //3
alert(numbers.lastIndexOf(4));    //5
alert(numbers.indexOf(4, 4));     //5
alert(numbers.lastIndexOf(4, 4)); //3
var person = { name: "Nicholas" };
var people = [{ name: "Nicholas" }];
var morePeople = [person];
alert(people.indexOf(person));     //-1
alert(morePeople.indexOf(person)); //0

说明:如果在数组中没有检索到该值,则返回值为 -1;
说明2:数组在进行检索比较时执行的是全等操作。
特别说明:lastIndexOf 虽然是从后向前检索,但是得到的位置已经是从前到后进行排序的位置

迭代操作

迭代操作指对数组中的每一项进行的迭代操作,数组内置提供了every()、some()、filter()、map()、forEach()五种方法。每一种方法都传入两个参数,要在数组项上运行的函数和(可选项)函数的作用域。

  • every()检查数组中的每一项是否都满足指定条件,只有每一项都返回为true时,函数才会返回true;返回值:布尔型

  • some()检查数组中任意一项是否满足指定的条件,有一项满足就会返回true。

var numbers = [1,2,3,4,5,4,3,2,1];
var everyResult = numbers.every(function(item, index, array){
    return (item > 2);
});
alert(everyResult);       //false
var someResult = numbers.some(function(item, index, array){
    return (item > 2);
});
alert(someResult);       //true

说明:every和some的功能一样,都是为了检查数组中的数组项是否满足某一个指定条件。every是需要每一个数组项都满足一定的条件才会返回true。some是任意一项满足条件后就会返回true

  • filter() 返回满足某一条件的数组项的数组,主要用于过滤查询使用
var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter(function(item, index, array){
    return (item > 2);
});
alert(filterResult);   //[3,4,5,4,3]
  • map() 返回执行完某一指定操作的数据,主要用于生成与当前数组相关的数组
var numbers = [1,2,3,4,5,4,3,2,1];
var mapResult = numbers.map(function(item, index, array){
    return item * 2;
});
alert(mapResult);   //[2,4,6,8,10,8,6,4,2]
  • forEach() 对数组项进行一定的操作,常用函数
var numbers = [1,2,3,4,5,4,3,2,1];
numbers.forEach(function(item, index, array){
    //执行一些操作,无返回值
});
归并操作

在ES5中内置了两种方法来实现数组项的归并,reduce()和reduceRight(),两者的唯一区别为数据的检索是从头开始的,还是从最后一项开始的。函数都支持两个参数,一个是执行归并的函数,(可选项)归并开始的初始值.

  • reduce(function(pre , cur , index , array)) 数据项回调函数中的参数为上一个结果,当前值,当前索引项,数组。主要用于对每一项进行合并迭代操作时
var values = [1,2,3,4,5];
var sum = values.reduce(function(prev, cur, index, array){
    return prev + cur;
});
alert(sum); //sum = 15

说明:第一次执行回调函数是从第二项开始的,即prev = 1 , cur =2;第二次执行回调函数的prev为上一次执行回调函数的返回值。
说明2:reduceRight()只是从最后一项开始的,即prev = 5,cur=4;

Date类型

date类型指日期对象,在早期的java.util.Date类的基础上进行构建。所以Date类型的值起始于UTC 1970年1月一日午夜0点。以毫秒数保存时间。

创建date类型的数据
  • 通过new关键字进行创建
var now = new Date();
alert(now);
获取当前时间的毫秒数

date提供了两种函数获取当前时间的毫秒数,Date.parse()和Date.UTC()

  • Date.parse() 接收一个表示时间的参数,如果参数不能转换为时间,则会返回一个NAN
var someDate = new Date(Date.parse("May 25, 2004"));
alert(someDate);
  • Date.UTC()接收一个表示时间的参数,但是使用的参数信息不同。第一个参数表示年份、基于0开始的月份,日期,小时,分钟,秒
//May 5, 2005 at 5:55:55 PM GMT
var allFives = new Date(Date.UTC(2005, 4, 5, 17, 55, 55));
alert(allFives.toUTCString());

说明:在Date的构造函数中,即使不调用这两个函数,构造函数也会自动调用这两个函数。把表示时间的参数直接传递给构造函数,会返回一样的结果。
说明2:如果在构造函数中传入UTC格式的参数,构造函数获取的是当前地区的时间,而不是GMT时间。

  • now() 在ES5中支持的获取当前时间的函数
var now = Date.now();
日期的组件方法

date类型中直接设置时间的方法

  • getTime() 获取时间的毫秒数,和valueof()返回的值一致
  • setTime(毫秒数) 以毫秒数设置事件,会改变整个时间
  • getFullYear() 获取四位数的年份
  • setFullYear() 设置四位数的年份
  • getMonth() 获取初始值为0的月份 0-11
  • setMonth(01) 设置日期的年份,设置的时间必须大于0,超过11则增加年份
  • getDate() 获取时间的天数(1-31)
  • setDate() 设置天数,超过当前月的天数后月份加1(1-31)
  • getDay()获取时间的星期几(0-6)
  • getHours() 获取时间的小时数(0-23)
  • setHours()设置时间的小时数(0-23)
  • getMinutes() 获取时间的分钟(0-59)
  • setMinutes() 设置时间的分钟(0-59)
  • getSeconds()获取时间的秒数(0-59)
  • setSeconds()设置时间的秒数(0-59)

RegExp类型

在js中通过RegExp类型支持正则表达式格式

使用字面量格式定义正则表达式
  • 格式:var expre = /正则模式/正则标志;正则模式表示简单或复杂的正则表达式,正则标志表示正则表达式的行为,一个正则可以支持一种或多种标志。

  • 三种正则标志:g、i、m
    – g:表示全局模式。即模式适用于所有的字符串,并不是在匹配到第一个匹配项后就立即停止。
    – i:表示不区分大小写模式。即在进行模式匹配时忽略字符的大小写
    – m:表示多行模式,即在到达一行文本的末尾时还会继续查找下一行中是否存在与模式匹配的项。

  • 说明:类似于其他语言,在模式中使用元字符必须进行转义。({[|$^?*+.]})

var patten = /\[bt\]at/g;
使用RegExp定义正则
  • 格式:var expre = new RegExp(‘模式’,‘标志’); 构造函数接收两个参数,第一个为正则模式,第二个为标志。两个参数都为string格式.
  • 说明2:使用构造函数定义正则,因为传入的参数都是string类型,所以元字符在有时候需要双重转义
var patten2 = new RegExp'[bc]at' , 'g';
实例属性
  • global:获取当前实例是否设置了全局标志
  • ignoreCase:布尔值,获取当前实例是否设置了忽略大小写的标志
  • lastIndex:获取开始搜索下一个匹配项的位置,起始值为0
  • multiline:获取当前实例是否设置了m标志
  • source:获取正则模式,说明:无论是通过构造函数定义还是通过字面量定义,source返回的值都是一致的,都是字面量的标准正则模式。
var pattern1 = /\[bc\]at/i;
alert(pattern1.global);     //false
alert(pattern1.ignoreCase); //true
alert(pattern1.multiline);  //false
alert(pattern1.lastIndex);  //0
alert(pattern1.source);     //"\[bc\]at"
//使用构造函数定义
var pattern2 = new RegExp("\\[bc\\]at", "i");
alert(pattern2.global);     //false
alert(pattern2.ignoreCase); //true
alert(pattern2.multiline);  //false
alert(pattern2.lastIndex);  //0
alert(pattern2.source);     //"\[bc\]at"
实例方法
  • exec() 接收要进行匹配的字符串作为参数,返回匹配组的数组。该数组包含两个属性index和input。index表示匹配项开始的位置,input表示进行匹配的字符串
var text = "mom and dad and baby";
var pattern = /mom( and dad( and baby)?)?/gi;
var matches = pattern.exec(text);
alert(matches.index);    //0
alert(matches.input);    //"mom and dad and baby"
alert(matches[0]);       //"mom and dad and baby"
alert(matches[1]);       //" and dad and baby"
alert(matches[2]);       //" and baby"

说明:exec()函数在执行过程中,即使设置了g标志,每次也只会返回一个匹配项,但是如果循环执行exec(),在第二次执行的时候会从上一次匹配项开始进行匹配。如果不设置g标志,每一次都是从0开始匹配

var text = "cat, bat, sat, fat";        
var pattern1 = /.at/;
var matches = pattern1.exec(text);        
alert(matches.index);    //0
alert(matches[0]);       //"cat"
alert(pattern1.lastIndex);//0
matches = pattern1.exec(text);        
alert(matches.index);    //0
alert(matches[0]);       //"cat"
alert(pattern1.lastIndex);//0
var pattern2 = /.at/g;
var matches = pattern2.exec(text);        
alert(matches.index);    //0
alert(matches[0]);       //"cat"
alert(pattern2.lastIndex);//0
matches = pattern2.exec(text);        
alert(matches.index);    //5
alert(matches[0]);       //"bat"
alert(pattern2.lastIndex);//0
  • test() 接收要进行匹配的字符串作为参数,返回布尔值。一般用于检测一个字符串是否满足某一个验证规则。
var text = "cat, bat, sat, fat";        
var pattern = /.at/;
if (pattern.test(text)){
    alert("The pattern was matched.");
}
  • toString()和toLocalString()。RegExp对象继承了对象的两个方法,两者的返回值一致,都是正则的标准模式。
var pattern = new RegExp("\\[bc\\]at", "gi");
alert(pattern.toString());    // /\[bc\]at/gi
alert(pattern.toLocaleString());    // /\[bc\]at/gi
  • valueof()返回的为正则模式的本身。构造函数如果是双转义就返回双转义模式,字面量则是标准模式。

Function 类型

function函数也是一个对象,函数名实际上指的是指向函数对象的指针。

声明function类型的两种方式
  • 函数式声明
function sum (numl , num2) {
    return numl + num2; 
}
  • 字面量声明
var sum = function(sum1 , sum2){
    return (sum1 + sum2);
}

说明:函数声明和字面声明在本质上没有区别,但是使用函数声明具有函数作用域提升,可以在函数声明前使用该函数。但是如果函数是通过字面量进行的声明,则会报错。
说明2:因为函数名是指向函数对象的指针,所以可以通过函数名调用访问该对象,注意:只能通过函数名调用,不能添加括号,添加括号后就变成了执行该函数。

在js中的函数没有重载
 因为函数名表示的是函数对象的指针,所以如果通过函数名改变了函数体内容,则会将原来堆内存内的函数体改变,覆盖原函数,执行修改后的函数。所以在js中没有函数重载。
函数声明和函数表达式的关系
在加载函数时,解析器先读取函数声明,提升其作用域到文件顶端,使函数可以在任何代码中被执行使用。而函数表达式是在执行该函数时,才会被真正的解析执行。
alert(sum(10,10));    //causes an error
var sum = function(num1, num2){
    return num1 + num2; //使用字面量声明的函数会报错
}; 
//该变量在使用前还没有被定义
alert(sum(10,10));    //正常执行,通过函数声明的方式会通过一个作用域提升的过程
function sum(num1, num2){
    return num1 + num2; 
}; 
//该变量在使用前还没有被定义

说明:两种声明方式除了访问时间不同外,其他实现的效果一样。

函数作为参数传递给另外一个函数
  • 实例:对数组进行排序
 function createComparisonFunction(propertyName) {
     return function(object1, object2){
         var value1 = object1[propertyName];
         var value2 = object2[propertyName];
         if (value1 < value2){
             return -1;
         } else if (value1 > value2){
             return 1;
         } else {
             return 0;
         }
     };
 }
var data = [{name: "Zachary", age: 28}, {name: "Nicholas", age: 29}];
data.sort(createComparisonFunction("age"));
函数的内部属性

函数含有两个内部属性:this , arguments

  • arguments对象
    作用:arguments对象是一个类数组对象,主要用途是当前函数的所有参数。虽然arguments的类型是数组类型,但是并不是数组,是类数组,除了含有length属性和可以通过下标访问值之外,不具备其他的数组内置函数。
    特殊属性:arguments对象含有一个callee属性,可以返回拥有这个对象的函数。主要用于解耦函数的自调用问题。
//实现阶乘函数 
function factorial(num){
     if (num <= 1) {
         return 1;
     } else {
         return num * arguments.callee(num-1) //等效于 num*factorial(num-1)
     }
 }
  • this对象
    作用:得到函数执行的环境对象
    特殊属性:caller,返回当前函数的函数引用
    说明:this.caller = 函数名.caller
函数属性和方法

函数自身内置的常用属性为length , 方法:apply()、call()、bind()

  • length属性
    作用:保存函数希望接收的参数的个数
function sayName(name){
    alert(name);
}
function sum(num1, num2){
    return num1 + num2;
}
function sayHi(){
    alert("hi");
}
alert(sayName.length);  //1
alert(sum.length);      //2
alert(sayHi.length);    //0
  • 非继承函数apply()和call()
    -apply和call函数的作用都是在特定的作用域中调用函数,即设置函数内this对象的值。
    -apply函数接收两个参数,一个是this的作用域,一个是函数执行需要的参数。
    -apply 和 call 的区别:apply()接收的参数可以是数组的实例,也可以是arguments对象。call()必须准确的接收每一个函数。
//apply函数的参数举例
function sum(num1, num2){
    return num1 + num2;
}
function callSum1(num1, num2){
   return sum.apply(this, arguments);
}
function callSum2(num1, num2){
   return sum.apply(this, [num1, num2]);
}
//call函数的参数举例
function callSum(num1, num2){
   return sum.call(this, num1, num2);
}
  • bind()
    在ES5中定义的函数,提供了bind函数。通过创建一个函数实例,通过bind函数,this会自动绑定到bind提供的参数中
window.color = "red";
var o = { color: "blue" };
function sayColor(){
    alert(this.color);
}
var objectSayColor = sayColor.bind(o);
objectSayColor();   //blue

使用作用域扩充的优点是,解耦了函数和对象之间的关系,如果想要调用某个函数内的属性,就不需要先把函数赋值给该对象了。

基本包装类型

基本包装类型即在我们创建基本类型的同时,后台会创建相对应的包装类,包装类属于对象。包装类在运行中时会马上创建,使用,马上销毁。所以我们对于包装类只能是读取,而不能添加设置属性或方法。

Boolean类型

重点说明:通过Boolean对象创建的所有实例都会转换为true。

//包装类
var falseObject = new Boolean(false);
var result = falseObject && true;
alert(result);  //true
//基本数据类型
var falseValue = false;
result = falseValue && true;
alert(result);  //false
//包装类和基本数据类型的类型
alert(typeof falseObject);   //object
alert(typeof falseValue);    //boolean
alert(falseObject instanceof Boolean);  //true
alert(falseValue instanceof Boolean);   //false
Number类型

Number类型和boolean类型一致,通过new关键字并传入数字得到数值类型的实例。Number类型重写了Object的valueOf、toString()、toLoacalString()函数,并内置对数值的处理函数。

valueOf()函数返回相对应的基本数据类型的值
toString()和t0LocalString()返回相对应数值的字符串类型
toFixed()通过传入的参数,获取指定小数位数的字符串
toExponential()通过传入的参数,获取指定小数位数的E表示法结果
toPrecision()传入当前值的总位数,以最合适的方法选择调用toFixed()还是选择调用 toExponential()方法

var numberValue = 99;
alert(numberValue.toFixed(2));         //'99.00'
alert(numberValue).toExponential(1);   //'9.9e+2'
alert(numberObject.toPrecision(1));    //"1e+2"
alert(numberObject.toPrecision(2));    //"99"
alert(numberObject.toPrecision(3));    //"99.0"

特别说明:在使用Number的内置函数时,无需手动执行new Number实例,在执行字面量函数时后台会自动生成实例,使用这些内置函数。

Sting类型
  • length属性
    获取字符串的字符长度
对字符操作的函数 charAt()和charCodeAt()
  • charAt():获取字符串指定位置的字符,参数:基于0开始的数值
  • charCodeAt():获取字符串指定位置字符的编码,参数:基于0开始的数值
  • 在ES5中可以直接通过方括号的方式访问指定位置的字符
var stringValue = "hello world"; 
alert(str1ngValue.charAt(1));//输出e
alert(stringValue.charCodeAt(1));//输出101 e的字符编码
alart(stringValue[1]);//通过下标获取数据
对字符串的操作concat()、slice()、subString()、subStr()
  • concat()一般用于字符串的拼接,接收一个或多个字符串用于拼接,不改变原字符串
  • slice(开始的位置,结束的位置) 一般用于截取字符串,不包括结束的字符。不改变原字符。如果传入的是负数,则将负数和长度相加后执行。
  • subString(开始的位置,结束的位置) 作用的slice一样,不包含结束的字符,不改变原字符。如果传入的是负值,则会把所有的负数参数转换为0
  • subStr(开始的位置,返回的字符的个数):作用和slice一样。如果传入的是负值,则第一个参数会和长度相加,第二个会转换为0;
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"
/*传入负值的情况*/
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));     //"" (empty string)

特别说明:slice函数如果第一个字符大于第二个字符,则返回空字符。sunString()如果第一个字符大于第二个字符,则从第二个字符开始截取,截取到第一个字符。

字符串的位置方法 indexOf()和lastIndexOf()
  • indexOf(‘要查找的字符’,开始查找的位置) 从字符串的头部开始查找一个字符,返回字符的位置
  • lastIndexOf(‘要查找的字符’,开始查找的位置) 从字符串的最后开始向前查找一个字符,返回字符的位置。(说明虽然是从后开始查找,但是得到的结果和传入的开始查找的位置都是基于0从前开始的)
//说明:如果要查找的是一个单词,则会返回该单词的首字符在字符串中的位置
var stringValue = "good good Study,good good up";
var positions = new Array();
var pos = stringValue.indexOf("good");
while(pos > -1){
    positions.push(pos);
    pos = stringValue.indexOf("good", pos + 1);//pos+1 以确保是从下一项开始查找
}
alert(positions);    //"0,5,16,21"
除空格函数trim()
  • trim() 除去字符串前置和结尾的空格,返回结果
    说明:只会删除前置和结尾的空格,在字符串中间的空格不会删除
字符串的大小写函数toUpperCase()和toLowerCase()
  • toUpperCase()和toLocaleUpperCase()两者都是用于将字符串转换为大写的模式。toLocaleUpperCase()是根据不同的语言将字符转换为大写。
  • toLowerCase()和tLocaleLowerCase()
字符串的模式匹配方法 match()、search()、replace()
var text = "cat, bat, sat, fat"; 
var pattern = /.at/;
var matches = text.match(pattern);        
alert(matches.index);        //0
alert(matches[0]);           //"cat"
alert(pattern.lastIndex);    //0

var pos = text.search(/at/);
alert(pos);   //1

var result = text.replace("at", "ond");
alert(result);    //"cond, bat, sat, fat"

result = text.replace(/at/g, "ond");
alert(result);    //"cond, bond, sond, fond"

猜你喜欢

转载自blog.csdn.net/weixin_41305441/article/details/89314428
今日推荐