前端中的简单编程题-字符串（1）

游幕
1,507 阅读7分钟

一边学习前端，一边通过博客的形式自己总结一些东西，当然也希望帮助一些和我一样开始学前端的小伙伴。

如果出现错误，请在评论中指出，我也好自己纠正自己的错误

author： thomaszhou

字符串操作

编写函数把URL参数解析为一个对象

ar url = "http://www.taobao.com/index.php?key0=0&key1=1&key2=2.............";
var obj = parseQueryString(url);
console.log(obj);// {key0: "0", key1: "1", key2: "2............."}

function parseQueryString(argu){
  var str = argu.split('?')[1];
  var result = {};
  var temp = str.split('&');
  for(var i=0; i<temp.length; i++)
  {
    var temp2 = temp[i].split('=');
    result[temp2[0]] = temp2[1];
  }
  return result;
}

首字母大写

  • 通用方法：每个单词的首字母大写
  • 方法一：利用slice方法进行大写化的首字母和其余的字符串拼接

var str1 = 'I believe I am the best';
    function trans1(str1) {
      var arr = str1.toLowerCase().split(' ');
      for (var i in arr) {
          arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].slice(1);
      }
      return arr.join(' ');
    }
console.log(trans1(str1));//I Believe I Am The Best
  • 方法二：直接用replace进行首字母替换
var str1 = 'I believe I am the best';
    function trans1(str1) {
      var arr = str1.toLowerCase().split(' ');
      for (var i in arr) {
          arr[i] = arr[i].replace(arr[i].charAt(0),arr[i].charAt(0).toUpperCase());
      }
      return arr.join(' ');
    }
console.log(trans1(str1));
  • 方法三：用正则表达式匹配单词和replace来做
//  /\w\S*/g匹配每一个单词，其实类似于字符串的数组分解
    var str1 = 'I believe I am the best';
    function trans1(str1) {
      return str1.replace(/\w\S*/g, function (arr) {
          return arr.charAt(0).toUpperCase() + arr.slice(1).toLowerCase();
      });
    }
console.log(trans1(str1));
  • 方法四：ES6，用正则匹配最开始的首字母以及空格分隔的每个单词的首字母
var str1 = 'I believe I am the best';
    function trans1(str1) {
     return str.toLowerCase().replace(/( |^)[a-z]/g, (L) => L.toUpperCase());
    }
console.log(trans1(str1));

子模版匹配

从字符串中找到某个子字符串（用到indexof,substring,join）

    var str2 = 'asdasfsdfasd1zhou1fsf'
    var target = 'zhou'
    var x = str2.indexOf(target)
    var result1 = str2.substring(0, x)
//    var result1 = str2.substr(start,length)是从start开始，街区length个字符
    var result2 = str2.substring(x + target.length, str2.length)
//    console.log(typeof string)    string
    var result = result1 + result2
//    不建议用match()
//    var match = str2.match(target)[0]
//    console.log(match)匹配到第一个值
    console.log(result)

字符和数字互换

  • 1、数字转换为字符串

    • a. 要把一个数字转换为字符串，只要给它添加一个空的字符串即可：
    var n = 100; 
var n_as_string = n + "";
    • b. 要让数字更加显式地转换为字符串,可以使用String()函数:
    var string_value = String(number);
    • c. 使用toString()方法
    string_value = number.toString();
    Number对象的（基本的数字转换为Number对象，以便可以调用这个方法）toString()方法有一个可选的参数，该参数用来指定转换的基数。如果不指定这个参数，转换会以10为基数进行。然而，也可以按照其他的基数（2到36之间的数）来转换数字。
    var n = 17; 
binary_string = n.toString(2); //  "10001" 
octal_string = "0" + n.toString(8); //  "021"   
hex_string = "0x" + n.toString(16); //  "0x11"
    • d.**toFixed()**方法把一个数字转换为字符串，并且显示小数点后的指定的位数。它不使用指数表示法。
    var n = 123456.789; 
n.toFixed(0); // "123457" 
n.toFixed(1); // "123456.8"
    • e. toExponential()使用指数表示法把一个数字转换为字符串，小数点前面有1位数，而小数点后面有特定的位数。
    var n = 123456.789; 
n.toExponential(0); // "1e+5" 
n.toExponential(1); // "1.2e+5"

  • 2、字符串转换为数字

    • a. ：把Number()构造函数作为一个函数来调用：
    var number = Number(string_value); 
Number(false) 0
Number(true) 1
Number(undefined) NaN
Number(null) 0
Number( "5.5 ") 5.5
Number( "56 ") 56
Number( "5.6.7 ") NaN
Number(new Object()) NaN
Number(100) 100
    • b. parseInt()只截取整数，如果一个字符串以"0x"或"0X"开头，parseInt()将其解析成为一个十六进制的数字，parseInt()甚至可以接受一个参数来指定要解析的数字的基数，合法的值在2到36之间。
    parseInt("3 blind mice"); // Returns 3 
parseInt("12.34"); // Returns 12 
parseInt("0xFF"); // Returns 255 
parseInt("11", 2); // Returns 3 (1 * 2 + 1) 
parseInt("ff", 16); // Returns 255 (15 * 16 + 15) 
parseInt("zz", 36); // Returns 1295 (35 * 36 + 35) 
如果十进制数包含前导0，那么最好采用基数10，这样才不会意外地得到八进制的值
parseInt("010"); //returns 8 默认八进制
parseInt("077", 8); // Returns 63 (7 * 8 + 7) 
parseInt("077", 10); // Returns 77 (7 * 10 + 7)
    • c. parseFloat()截取整数和浮点数。使用parseFloat()方法的另一不同之处在于，字符串必须以十进制形式表示浮点数，parseFloat()没有基模式
    parseFloat("3.14 meters"); // Returns 3.14 
parseFloat("1234blue"); //returns 1234.0
parseFloat("0xA"); //returns NaN
parseFloat("22.5"); //returns 22.5
parseFloat("22.34.5"); //returns 22.34
parseFloat("0908"); //returns 908
parseFloat("blue"); //returns NaN

如果parseInt()和parseFloat()不能够把指定的字符串转换为数字，它们就会返回NaN: 
parseInt(''eleven"); // Returns Nan 
parseFloat("$72.47"); // Returns NaN
    • d. Boolean()函数将返回true。如果该值是空字符串、数字0、undefined或null，它将返回false。
    Boolean(""); //false – empty string
Boolean("hi"); //true – non-empty string
Boolean(100); //true – non-zero number
Boolean(null); //false - null
Boolean(0); //false - zero
Boolean(new Object()); //true – object
Boolean(undefined) // false
  • 3、利用js变量弱类型转换
var str = '12.345'// 有效
var str = '123.4.4'//NaN
var str = '12r3'//NaN

var str= '012.345 ';
var x = str-0;
x = x*1;
  • 4\额外知识点: JavaScript取整的方法
    • a.丢弃小数部分,保留整数部分 parseInt(5/2)
    • b.向上取整,有小数就整数部分加1 Math.ceil(5/2)
    • c.向下取整 Math.floor(5/2)
    • d.四舍五入 Math.round(5/2)
  • 5\字符串，数字互相转换、asc码转换
传入字符串或者2位以上的数字，每个字符或者单个数字ascii码减10
function toMD5(arg){
      var str = [];
      str = arg.split('');
      len = str.length;
      for(var i = 0; i < len; i++){
      //str.charCodeAt()  将字符str变成ascii码
      //String.formCharCode(str)   将ascii码str变成字符
        str[i] = String.fromCharCode(str[i].charCodeAt() - 10);
      }
      return str;
    }

重复字符串

这里所说的重复字符串是指对所给的字符串根据第一个数字参数重复次数

repeatStringNumTimes("*", 3)返回***
repeatStringNumTimes("abc", -2)
  • 方法一： 基本循环
function fn1(str, num) {
  str1 = '';
  while (num > 0) {
    str1 += str;
    num--;
  }
  return str1;
}
console.log(fn1('a',4));
  • 方法二：添加到数组中，最后用join拼接
function fn2(str, num) {
  arr = [];
  for (var i = 0; i < num; i++) {
      arr.push(str);
  }
  return arr.join('');
}
console.log(fn2('a',4));
  • 方法三：new Array()是新建一个数组，然后将要重复的字符拼接''，就相当于重复字符串
function fn3(str, num) {
//  如果重复两个a,那需要三个'',
//    ''+'a'+''+'a'+'';
  return num < 0 ? '': new Array(num + 1).join(str);
}
console.log(fn3('a',4));
  • 方法四：递归
//递归
function repeat(str, num) {
  if (num === 0) {
    return '';
  }
  if (num === 1){
    return str;
  }else{
    return str + repeat(str, num-1);
  }
}
console.log(repeat('b', 4));

检测字符串b内的字符是否都在字符串a中出现

对一个包含两个元素的数组，检测数组中的第二个元素的所有字母是否都在第一个元素中出现过，如果出现过，返回的是true，否则返回的是false。(其中忽略大小写)

  • 简单分解一下：
    • 将目标字符串(数组中的第一个元素arr[0])和测试字符串(数组中的第二个元素arr[1])转换为小写字符串(通过toLowerCase())
    • 将数组中的两个元素分别转换为数组(通过split())
    • 使用for循环将测试字符串每个字符传入到目标字符串中搜索(通过indexOf())
    • 如果搜索传回值为负数，也就是indexOf()传来的值为-1，则返回false，也就是说测试字符串在目标字符串中没有匹配的字符串
    • 若全部字符串匹配(indexOf()的值大于或等于0)，返回true
var arr = ['hello world','eowl'];
    var arr1 = ['hello world','howa'];
    function mutation(arr) {
        var str1 = arr[0].toLowerCase().split(''),
            str2 = arr[1].toLowerCase().split('');
        console.log(str1);
        console.log(str2);
        var value = [];//存储匹配的字符的下标
        for (var i = 0, len = str2.length; i < len; i++) {
          var temp = str1.indexOf(str2[i]);
          value.push(temp);
          if (temp === -1) {
              console.log(value);
              //arr1为参数value值(匹配错误)：[0,4,6,-1]
            console.log('false');
            return false;
          }
        }
        console.log(value);//匹配正确时：[1,4,6,2]
        console.log('true');
        return true;
    }
    mutation(arr);
avatar
文章
阅读
粉丝