Summary of replace in javascript
- 2021-07-24 10:11:09
- OfStack
ECMAScript provides the replace () method. This method takes two arguments, the first argument can be an RegExp object or a string, and the second argument can be a string or a function. Now let's explain several possible situations in detail.
1. The case where both parameters are strings
var text = 'cat, bat, sat, fat';
// Find in the string at And will at Replace with ond , replace only 1 Times
var result = text.replace('at', 'ond');
// "cond, bat, sat, fat"
console.log(result);
2. The first argument is an RegExp object, and the second argument is a string
We can see that in this case, only the first at is replaced, and if you want to replace all at, you must use the RegExp object.
var text = 'cat, bat, sat, fat';
// Use /at/g Matching in the Global at , and use ond Make a replacement
var result = text.replace(/at/g, 'ond');
// cond, bond, sond, fond
console.log(result);
3. Consider capturing groups in an RegExp object
RegExp has nine attributes for storing capture groups. $1, $2... $9 for storing matching capture groups 1 through 9, respectively. We can access these properties to get the stored values.
var text = 'cat, bat, sat, fat';
// Use /(.at)/g The parentheses are capture groups, and only 1 Therefore, the matching value is stored in the $1 Medium
var result = text.replace(/(.at)/g, '$($1)');
// $(cat), $(bat), $(sat), $(fat)
console.log(result);
4. If the second argument is a function, there is no capture group in RegExp object
var text = 'cat, bat, sat, fat';
// Use /at/g Matches all of the at And replace it with ond ,
// The parameters of the function are: the current matching character, the position of the current matching character, and the original string
var result = text.replace(/at/g, function(match, pos, originalText) {
console.log(match + ' ' + pos);
return 'ond'
});
console.log(result);
// Output
/*
at 1 dd.html:12:9
at 6 dd.html:12:9
at 11 dd.html:12:9
at 16 dd.html:12:9
cond, bond, sond, fond dd.html:16:5
*/
5. If the second argument is a function, there is a capture group in the RegExp object
var text = 'cat, bat, sat, fat';
// Use /(.at)/g Matches all of the at And replace it with ond ,
// When a capture group exists in a regular expression, the parameters of the function 1 Next is: Pattern Matches, 1 The matches of the capture groups,
// No. 1 2 Matches of 10 capture groups ... The position of the match in the string, the original string
var result = text.replace(/.(at)/g, function() {
console.log(arguments[0] + ' ' + arguments[1] + ' ' + arguments[2]);
return 'ond'
});
console.log(result);
// Output
/*
cat at 1
bat at 6
sat at 11
fat at 16
cond, bond, sond, fond
*/
These are all possible scenarios for the replace method, and we use replace and regular expressions to implement the string trim method.
(function(myFrame) {
myFrame.trim = function(str) {
// ' hello world '
return str.replace(/(^\s*)|(\s*$)/g, '');
};
window.myFrame = myFrame;
})(window.myFrame || {});
// Test
var str = ' hello world '
console.log(str.length); // 15
console.log(myFrame.trim(str).length); // 11