leetCode-028 - 实现strStr（implement-strstr）

028 - 实现strStr（implement-strstr）

/*
 * @Author: lvjingshuai 
 * @Date: 2019-07-20 6:29:55 
 * @Last Modified by: lvjingshuai
 * @Last Modified time: 2019-08-15
 */

文章结构
1、题目介绍
2、解题
2.1 解法 - indexOf()
2.2 解法 - substring()
2.3 解法 - 双层for循环
3、每日一问

1、题目介绍

• 难度：简单 （系统学习算法与数据结构）
• 涉及知识：双指针、字符串
• 题目编号：028
• 题目地址：https://leetcode-cn.com/problems/implement-strstr/
• 题目内容：

实现 strStr() 函数。

给定一个 haystack 字符串和一个 needle 字符串，在 haystack 字符串中找出 needle 字符串出现的第一个位置 (从0开始)。如果不存在，则返回  -1。

示例 1:
输入: haystack = "hello", needle = "ll"
输出: 2

示例 2:
输入: haystack = "aaaaa", needle = "bba"
输出: -1

说明:
当 needle 是空字符串时，我们应当返回什么值呢？这是一个在面试中很好的问题。

对于本题而言，当 needle 是空字符串时我们应当返回 0 。这与C语言的 strstr() 以及 Java的 indexOf() 定义相符。

2、解题

2.1 解法 - indexOf

解题思路：

本能indexOf，直接使用 JS 内置方法……

解题代码：

var strStr = function(haystack, needle) {
  return haystack.indexOf(needle);
};

执行测试：

1. haystack：hello
2. needle：ll
3. return：2

知识点：

1. indexOf()：判断数组中是否存在判断条件中的值。如果存在，则返回第一次出现的索引；如果不存在，则返回 -1。

2.2 解法 - substring()

解题思路：
本能substring，直接使用 JS 内置方法……，主要是本题目匹配字符。算是特比简单的一道题了

1. 边界考虑 haystack 和 needle 长度，若为0，return 0 退出
2. 遍历 haystack长串，判断 haystack 中某段字符串是不是等于 needle 。
3. 即则从 下标i 开始，判断 haystack 中的 i + needle.length 位是否等于 needle，是则返回对应的坐标 i。

解题代码：

var strStr = function(haystack, needle) {
  if (!haystack && !needle) {
    return 0;
  }
  for (let i = 0; i < haystack.length; i++) {
    if (haystack.substring(i, i + needle.length) === needle) {
      return i;
    }
  }
  return -1;
};

执行测试：

1. haystack：hello
2. needle：ll
3. return：2

知识点：

1. substring()：substring() 方法将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串。

2.3 解法 - 双层for循环

解题思路：
使用 JS 内置方法有点取巧。双层for循环嵌套来一个

1. 边界考虑 haystack 和 needle 长度，若为0，return 0 退出
2. 外层遍历 haystack长串，判断haystack的第一个字符 等于needle 的第一个字符，needle 内层循环才有意义
3. 即则从 下标i 开始，判断 haystack 中的 i + needle.length 位是否等于 needle，是则返回对应的坐标 i。

解题代码：

var strStr = function(haystack, needle){
    if (!needle) {
        return 0
    }
    for(let i = 0; i < haystack.length; i ++ ){
        if( haystack[i] === needle[0] ){
            let flag = true;
            for (let j = 1; j < needle.length; j++){
                if (haystack[i+j] !== needle[j]){
                    flag = false
                    break;
                }
            }
            if (flag) {
                return i
            }
        }
    }
    return -1
};

执行测试：

1. haystack：hello
2. needle：ll
3. return：2

3、每日一题

webpack 的 url-loader 与 file-loader 有何异同？

1. 通常webpack加载css背景图片background-image、img元素指向的网络图片src、使用es6的import引入的图片时，需要使用url-loader或者file-loader。url-loader和file-loader可以加载任何文件。

2. url-loader可以将图片转为base64字符串，能更快的加载图片，一旦图片过大，就需要使用file-loader的加载本地图片，故url-loader可以设置图片超过多少字节时，使用file-loader加载图片。