学习目标

ES6新的字符串方法

  • String.prototype.startsWith
  • String.prototype.endsWith
  • String.prototype.includes
  • String.prototype.repeat
  • String.prototype.padStart
  • String.prototype.padEnd

思考题

如何修改函数使得返回的时间永远是两个字符长度表示 03:03

//获取当前的小时数和分钟数
function getTime(){
    const date=new Date();
    return date.getHours() + ':' +date.getMinutes();
}
console.log(getTime()) // 上午3时03分会返回 字符串3:3
复制代码

搜索字符串

所有这些方法都是区分大小的，执行搜索前要将字符串小写化

所有这些方法还可以指定第二个参数指定字符串中的起始搜索位置

startsWith()

下面我们来看两个案例

/*
1.来自不同厂家的产品数据，价格字段有的有美元符，没有的需要我们自己加上,
所以需要检查是否已存在$的字段
*/
const PRODUCT_ARR=[
    {
        id:0001,
        name:"加多宝",
        price:"$1.00"
    },
    {
        id:0002,
        name:"农夫山泉",
        price:"0.5"
    },
    {
        id:0003,
        name:"脉动",
        price:"$0.80"
    },
    {
        id:0004,
        name:"味全每日C",
        price:"1.3"
    }
]

for(let i of PRODUCT_ARR){
    if(i.price[0]==='$'){
        //判断第一个字符有美元符
        console.log(i);
    }else{
        //没有的我们手动加上
    }
}

/*
    2。根据用户的当前电话判断所在区
 */
let userTel='021-888-8880';
const AREA_CODE= '021'
if(userTel.substr(0,3)===AREA_CODE){
    console.log(`当前用户的号码是在此区域`);
}
复制代码

现在有了ES6的startsWith()，我们可以改写如下：我们一眼就能看出他在做什么。

if(i.price.starstWith('$')){
    //....
}

if(userTel.starstWith(AREA_CODE)){
    //....
}
复制代码
endsWith()、includes()
let name='east-boat';
console.log(name.startsWith('east'));  //true
console.log(name.endsWith('boat'));  //true
console.log(name.includes('t-b')); //true
console.log(name.includes('-bo')); //true

复制代码

填充字符串

要求某个函数接受用十进制(基数为10)表示的IP地址，将其转化为二进制(基数为2)表示

function binaryIP(decimalIPStr){
    return decimalIPStr.split(".").map(function(octet){
        return Number(octet).toString(2)
    }).join('.')
}
console.log(binaryIP('192.168.2.1')); //11000000.10101000.10.1

复制代码

但是当ip地址小于128的数时，二进制数小于8位数字，此时上面的函数是无法执行的

解决办法：需要用0填充每一个字节，知道每一个都是8位

String.prototype.repeat
'0'.repeat(8) // 调用8次 '00000000'
'0'.repeat(4.9) // 如果不是整数，向下取整而不是四舍五入 '0000'

复制代码
// 添加es6特性解决
function binaryIP(decimalIPStr){
    return decimalIPStr.split(".").map(function(octet){
        let bin = Number(octet).toString(2);
        return '0'.repeat(8-bin.length) + bin;
    }).join('.')
}
console.log(binaryIP('192.168.2.1')); //11000000.10101000.00000010.00000001

复制代码
String.prototype.padStart和 String.prototype.padEnd
console.log('abc'.padStart(4)); //默认会在开头添加三个空格 
console.log('abc'.padStart(4).split(''));  [ ' ','a', 'b', 'c']
console.log('abc'.padEnd(4)); //默认会在结尾添加个空格
console.log('abc'.padEnd(4).split(''));  [ 'a', 'b', 'c', ' ' ]

//设置返回的字符串最大长度和所填充的字符串
console.log('123'.padStart(6,'x')); //xxx123
console.log('123'.padStart(6,'xy'));//xyx123
console.log('123'.padStart(6,'xyz'));//xyz123
console.log('123'.padEnd(6,'x')); //123xxx
console.log('123'.padEnd(6,'xy'));//123xyx
console.log('123'.padEnd(6,'xyz'));//123xyz

console.log('123'.padEnd(2,'x')); //如果最大长度小于原始字符串的长度，那么原始字符串不会被截取，直接返回，不作任何填充


复制代码

使用上面的方法重新binaryIP方法

function binaryIP(decimalIPStr){
    return decimalIPStr.split(".").map(function(octet){
         return Number(octet).toString(2).padStart(8,'0')
    }).join('.')
}
console.log(binaryIP('192.168.2.1')); //11000000.10101000.00000010.00000001


复制代码

使用repeat自定义函数

//使用repeat来写一个函数，重复任何字符串到50个字符，截断任何多余的字符
function repeat50(str){
    const len=50;
    return str.repeat(Math.ceil(len/str.length)).substr(0,len)
}

console.log(repeat50('east-boat'));
//east-boateast-boateast-boateast-boateast-boateast-

复制代码