JavaScript算法练习：字尾确认

作者：大漠 日期：2016-06-07 点击：1162
JavaScript学习笔记
JavaScript
JavaScript算法练习

字尾确认指的是对所给的字符串（第一个参数）确认是否是以第二个参数结尾，如果是则返回true，否则返回false。

也就是说，今天要做的任务是创建一个end()函数，并且给这个函数传入两个参数str和target。如果target和str末尾相同，则返回true，反之则返回false。

实现思路

知道要做的事情，我们就可以简单的拆分一下，实现end(str,target)函数的思路：

  • 运用String.prototype.substr()，来识别str结尾的字符
  • 声明变量endingPart是str字符的最后字符，最后字符的长度等于target的长度
  • 如果target === endingPart 返回true,否则返回false

这里最为重要的是我们要获取字符串str的末属的字符，也就是endingPart。其中endingPart需要具备的条件：

  • endingPart是一个字符串，而且是str末尾的字符串（从str最右边向最左边截取）
  • endingPart的长度和target字符长度相等

达到这两个条件并不难，在JavaScript中可以通过String.prototype.substr()来获取。这个方法可以获取字符串中从指定位置开始到指定长度的子字符串。比如：

var str = "He has to give me a new name";
var endingPart = str.substr(3);
console.log(endingPart); // has to give me a new name

上面的示例获取了str第3个到最后一位之间的所有字符。当然，还可以使用substr()中其他方法，比如给substr()传入不同的start和length参数：

var str = "He has to give me a new name";
console.log(str.substr(3,5));    // has t
console.log(str.substr(-3,2));   // am
console.log(str.substr(-3));     // ame
console.log(str.substr(-30,2));  // He
console.log(str.substr(30,2));   //

有关于substr()更详细的介绍可以点击这里阅读。

测试用例

  • end("Bastian", "n")返回true
  • end("Connor", "n")返回false
  • end("Walking on water and developing software from a specification are easy if both are frozen", "specification")返回false
  • end("He has to give me a new name", "name")返回true
  • end("He has to give me a new name", "me")返回true
  • end("He has to give me a new name", "na")返回false
  • end("If you want to save our world, you must hurry. We dont know how much longer we can withstand the nothing", "mountain")返回false

实现方法

经过前面的介绍，实现end(str,target)函数功能并不难。

通过target.length可以知道目标字符的长度，如此一来，通过就知道截取的字符串长度。根据substr()方法，可以通过-target.length或者str.length - target.lengt获取到对应的字符串。比如：

var str = "He has to give me a new name";
var target = "name";
console.log(str.substr(-target.length));  // name
console.log(str.substr(str.length - target.length)); // name
console.log(str.substr(str.length - target.length, target.length)); // name

看到这里，函数里要怎么写，并不复杂了。下面一起来看看：

function end(str, target) {
    var endingPart = str.substr(-(target.length)); 
    return target === endingPart;
}

// 或简化为

function end(str, target) {
    return str.substr(-target.length) === target;
}

实际中，可以把str.substr(-(target.length))换成str.substr(str.length - target.length)或者str.substr(str.length - target.length, target.length)都可以。比如下面的示例：

function end(str, target) {
    return str.substr(str.length - target.length) === target ? true : false;
}

// 或者
function end(str, target) {
    var endingPart = str.substr(str.length - target.length, str.length);

    return target === endingPart ? true : false;
}

还有另外一种情况，如果target是一个空字符串呢？那么这个时候，也希望函数返回的是false。那么可以在上面的基础做一个简单的修改：

function end(str, target) {
    return target.length > 0 && target === str.substr(str.length - target.length);
}

除了使用substr()这个方法之外，还可以使用slice()、indexOf()和lastIndexOf()方法。

slice()方法

function end(str,target) {
    var endingPart = str.slice(-target.length);

    return target === endingPart;
}

indexOf()方法

function end(str, target) {
    var endingPart = str.indexOf(target, str.length - target.length);

    return endingPart !== -1;
}

lastIndexOf()方法

function end(str, target){
    var endingPart = str.lastIndexOf(target);
    return endingPart === str.length - target.length;
}

有关于slice()、indexOf()和lastIndexOf()的详细介绍，可以阅读下面文章：

上述的方法都是ES5相关的方法，在ES6中提供了一个原生的方法endsWith()方法，可以非常简单的实现我们所要的功能：

function end(str, target) {
    return str.endsWith(target) ? true : false;
}

有关于endsWith()更详细的介绍可以点击这里阅读。

总结

本文通过字符串中的substr()、slice()、indexOf()、lastIndexOf()和endsWith()方法实现了对所给的字符串（第一个参数）确认是否是以第二个参数结尾，如果是则返回true，否则返回false。如果您有更好的解决方案或思路欢迎在下面的评论中与我们一起分享。

大漠

常用昵称“大漠”，W3CPlus创始人，目前就职于手淘。对HTML5、CSS3和Sass等前端脚本语言有非常深入的认识和丰富的实践经验，尤其专注对CSS3的研究，是国内最早研究和使用CSS3技术的一批人。CSS3、Sass和Drupal中国布道者。2014年出版《图解CSS3：核心技术与案例实战》。

如需转载，烦请注明出处：http://www.w3cplus.com/javascript/confirm-the-ending.html

返回顶部