1. Create a String object

var strOb = new String("abcefg"); ​ 
var strOb = String("abcefg"); ​ 
var strOb = "abcefg";

Summary: any data type, as long as it is enclosed in quotation marks, is a string object

2. String properties

stringObj.length (String length)

3. Method

3.1) substring position indexOf(string,[index]) / / returns the first occurrence of the substring abc in the string (calculated from 0). If it does not exist, returns - 1

String: the content of the searched string, which is required

index: start to find the location, optional

Return value: the return value is the position (subscript) of the found substring. By default, the first found content is returned; If the searched content does not exist, - 1 is returned

3.2 lastIndexOf(string,[index]) / / returns the last occurrence of the substring abc in the string

String: substring, the content of the searched string, required

index: start to find the location, optional

Return value: the return value is the position (subscript) of the found substring. By default, the first found content is returned; If the searched content does not exist, - 1 is returned

// Case: how many times to find afgdtywgbfnjekagrn string g 
var str = new String('afgdtywgbfnjekagrn');
var index = str.indexOf('g'); // 2
// Statistical times
var num = 0;
while(index !== -1){ // lookup
    num++;
    index = str.indexOf('g',index + 1);
}
console.log('g A total of'+num+'second');

3.3 slice(start,end) gets a part of a string

Interception is included before and not included after

Start indicates the start position, starting from 0 to positive infinity

End indicates the end position, which can be positive or negative

// Basic use
var str = 'hello wolrd';
console.log(str.slice(3,5));
console.log(str.slice(3,-1));

// Case: use slice and timer to realize the output of content
var str = 'My name is Zhang San. I'm thirteen years old';
var oBox = document.querySelector('#box');
var i = 0;
function show(){
    if(i<str.length){
        oBox.innerHTML += str.slice(i,++i); // Method 1
        oBox.innerHTML += str.charAt(i++); // Method 2
        setTimeout(show,100);
    }
}
show();

3.4. Intercept substr (start position, [intercept length]) / / if the interception is not written, it means that the end of the string is intercepted

Starting position: can be customized, starting from 0

Intercept length: it can be a number or not written; If the length is not written, it indicates that it is intercepted to the end of the string

Return value: the intercepted string

       

Substring (start position, [end position]) / / does not include the right boundary character of the interception result

Start position: it is a subscript value and cannot be negative

End position: it is a subscript value and cannot be negative (excluding the right boundary character of the interception result)

// Requirements: judge what type of picture is; The format of the photo must be png/jpg txt
// Get the suffix of the file name - the subscript at the beginning of the suffix - lastIndexOf / substr
function getSuffix(){
   var file = document.getElementById('files');
   var pic = file.value;// Path to the picture
   // var pic = '.././images/banner/one.txt'; 
   var suffix = pic.substr(pic.lastIndexOf('.')+1);
   if(suffix=='png'||suffix=='pneg'||suffix=='jpg'||suffix=='jpeg'){
       alert('The picture format is correct');
   }else{
       alert('Incorrect format!');
    }
}

<!-- Upload the file and judge whether the file format is correct -->
<input type="file" id='file'>
<button id='btn'>Submit</button>
<script>
    var oBtn = document.querySelector('#btn');
    var oFile = document.querySelector('#file');
    oBtn.onclick = function(){
        var res = getStr(oFile.value);
        if(res){
            alert('Upload succeeded')
        }else{
            alert('The picture format is incorrect')
        }
    }
</script>

3.5. replace('substring 1 ',' substring 2 ') / / replace substring 1 with substring 2

var str='My name is apple. So I like to eat apple very much!';
// 1. General replacement
alert(str.replace('apple','banana'));
alert(str.replace(/apple/g,'banana'));
​
// 2. Replace all numbers with spaces
var str2 = 'Zhang San 1 Li Si 2 Wang Wu 3 Ma Liu';
alert(str2.replace(/[0-9]/g,' '));
​
// 3. Replace all lowercase letters with spaces
var str2 = 'Zhang San w Li Si f Wang Wu n Ma Liu';
var newStr2 = str2.replace(/[a-zA-Z]/g,' '); 
console.log(newStr2);
​
//  4. Replace all letters with spaces [case insensitive]
var str2 = 'Zhang San w Li Si F Wang Wu n Ma Liu';
// var newStr2 = str2.replace(/[a-zA-Z]/g,' '); 
var newStr2 = str2.replace(/[a-z]/gi,' '); 
console.log(newStr2);

  ​​​

3.6 charAt(n) defaults to the first character

n represents subscript, the range is 0-positive infinity, and negative values cannot be used

3.7 str.charCodeAt} get the ASCII encoding of the specified character

var str1 = 'helloworld';
var getStr1 = str1.charCodeAt(2);
console.log(getStr1);

3.8 converting case

toLowerCase() to lowercase

toUpperCase() to uppercase

<!-- Login verification code effect -->
<input type="text" id='inp'><span>tR4wC</span><br/>
<button id='btn'>Button</button>
<script>
    // Rules of analog verification code
    // 1. Find the button
    var oBtn = document.querySelector('#btn');
    // 3. Get the contents in input
    var oInp = document.querySelector('#inp');
    // 4. Get the contents in span
    var oSpan = document.querySelector('span');
    // 2. Add click event
    oBtn.onclick = function(){
        // 5. Capitalize the contents of input
        var inp = oInp.value.toUpperCase();
        // 6. Capitalize the contents of span
        var yanzheng = oSpan.innerText.toUpperCase();
        if(inp == yanzheng){
            console.log('Validation succeeded');
        }else{
            console.log('Validation failed');
        }
    }
</script>

3.9 split the string into an array split (delimiter, [return the maximum length of the array])

Separator: it is a string type or regular expression

Return value: array

// Basic case
var str = 'I am student my name is jack'; 
console.log(str.split()); // Split the entire string into a whole
console.log(str.split(' ')); // Split by space
console.log(str.split('')); // Splits every character in a string
​
var str1 = 'Zhang San*20211203*10';
console.log(str1.split('*')); // Split by *
​
var str1 = "jack1Rose2Box3Tom4Jerry";
console.log(str1.split(/[0-9]/)); // Divide by number
​
var str1 = "Zhang San t Reese r Wang Wu p Ma Liu";
console.log(str1.split(/[a-z]/)); // Split by letter

3.10 bold() display string effect

italics() Italic

strike() delete

fontcolor('#f00') string color

fontsize(1-7) string size

sup() superscript label

sub() subscript label

var oFont = document.getElementById('font');
var val = oFont.innerText;
oFont.innerHTML = val.big().fontcolor('red').strike().fontsize(18);
// oFont.innerHTML = val.sub()
console.log(val.sub());

3.11 set as hyperlink

        link(url)

var oBox = document.querySelector('#box');
oBox.innerHTML = str.strike().fontsize(7).fontcolor('red').italics().link('http://www.baidu.com');