前端練習38 字串居中填充

padstart，padend及其polyfill

字串處理

完成函式centerpad可以讓乙個字串被包裹在指定的可重複的字串中間，例如：

centerpad('hello', 13, 'abc') // => 'abcahelloabca'
centerpad('gook luck!', 30, '*~') // => '*~*~*~*~*~gook luck!*~*~*~*~*~'

第乙個引數為被包裹的字串，第二個引數為最終的字串長度，第三個引數為用來填充的字元。

如果字串無法完全居中，那麼讓字串偏左，例如：

centerpad('hello', 10, 'abc') // => 'abhelloabc'

如果第二個引數傳入的字串長度比原來長度要短，直接返回原有字串即可，例如：

centerpad('hello', 1, 'abc') // => 'hello'

題目中有乙個提示，可以充分利用es6中新增的擴充套件方法。

可以利用的是es7的padstart，padend方法，這兩個方法用來將字串在開頭或者結尾填充字串，直至指定的長度。接受兩個引數，第乙個引數是指定字串的最終長度，第二個引數是當前用來填充的字串。

如果當前字串長度小於最小長度引數，會返回原字串。

所以我們這裡就可以使用這兩個方法，先使用padend填充字串的右邊，長度通過計算得來，然後使用padstart填充左邊

const centerpad = (str, len, pad) => 
const resttotal = len - str.length;
const restright = math.ceil(resttotal / 2) + str.length;
return str.padend(restright, pad).padstart(len, pad)
};

如果瀏覽器不支援的話怎麼辦呢？

我使用了array.from方法，來逐個填充字串：

string.prototype.padstart2 = string.prototype.padstart2 || function (targetlength, padstrin
padstring = string((typeof padstring !== 'undefined' ? padstring : ' '));
if (this.length > targetlength)  else );
return padarray.join('') + string(this)
}};

而mdn上給出的方法更巧妙，直接通過repeat方法按照targetlength/padstring.length來填充，repeat接受的引數會直接轉換為整數（parseint，再通過累加乙個padstring確保填充的長度大於實際需要的長度（實際上就是重複了math.ceil(targetlength/padstring.length)遍）

然後在將擷取(0, targetlength)這個範圍的結果就可以了。

還是更巧妙一些。

if (!string.prototype.padstart) 
else 
return padstring.slice(0, targetlength) + string(this);}};
}

使用我的方法，不利用padstart也能實現：

const centerpad = (str, len, pad) => 
const resttotal = len - str.length;
const restright = array.from(new array(math.ceil(resttotal / 2)), (v, index) => );
const restleft = array.from(new array(math.floor(resttotal / 2)), (v, index) => );
return [...restleft, str, ...restright].join('')
};

前端練習38 字串居中填充

38 字串的排列

（59）字串練習

基礎練習 01字串

前端練習38 字串居中填充

38 字串的排列

（59）字串練習

基礎練習 01字串

相關推薦