字符串的属性与方法
字符串的属性与方法
属性 ;length 长度
字符串是个伪数组
// var temp = new String('hello'); // for(var i=0;i<temp.length;i++){ // console.log(temp[i]); // }
// var str = 'hello';
// console.log(str.length) // 5
方法
1. indexOf返回子字符串abc在字符串中第一次出现的位置（从0开始计算），不存在返回-1
var str = 'hello world'; var one= str.indexOf('l'); var index=0; while(one>=0){ index++; one=str.indexOf('a',one+1); } console.log('l一共出现了'+index+'次');
2lastindexOf 返回子字符串abc在字符串中最后一次出现的位置
// var str = 'hello world'; // var one= str.lastIndexOf('l',3); // console.log(one);
案例 查看一个路径后缀是不是图片格式
// function getSuffix(){ // var file = document.getElementById('files'); // var pic = file.value;// 图片的路径 // // var pic = '.././images/banner/one.txt'; // var suffix = pic.substr(pic.lastIndexOf('.')+1); // if(suffix=='png'||suffix=='pneg'||suffix=='jpg'||suffix=='jpeg'){ // alert('图片格式正确'); // }else{ // alert('格式不正确！'); // } // }
3.截取
//slice(start,end) 获取字符串的某个部分
// 截取是前包含，后不包含
// start 表示开始位置，从0开始到正无穷
// end 表示结束位置，可以为正值，也可以为负值
// var str = '我的名字叫张三，我今年十三岁了我的名字叫张三，我今年十三岁了我的名字叫张三，我今年十三岁了'; // var oBox = document.querySelector('#box'); // var i = 0; // function show(){ // if(i<str.length){ // oBox.innerHTML += str.slice(i,++i); // 方法一 // // oBox.innerHTML += str.charAt(i++); // 方法二 // setTimeout(show,100); // } // } // show();
4. substr(起始位置,[截取长度]) //截取长度不写则代表截取到字符串未尾
// 起始位置：可以自定义，从0开始
// var str = '我的名字叫张三，我今年十三岁了我的名字叫张三，我今年十三岁了我的名字叫张三，我今年十三岁了'; // var oBox = document.querySelector('#box'); // var i = 0; // function show(){ // if(i<str.length){ // oBox.innerHTML= str.substr(0,++i); // 方法一 // // oBox.innerHTML += str.charAt(i++); // 方法二 // setTimeout(show,100); // } // } // show();
5. substring(起始位置,[结束位置]) //不包括截取结果的右边界字符
// 起始位置：是一个下标值，不能为负值
// 结束位置：是一个下标值，不能为负值（不包括截取结果的右边界字符）
// var str = '我的名字叫张三，我今年十三岁了我的名字叫张三，我今年十三岁了我的名字叫张三，我今年十三岁了'; // var oBox = document.querySelector('#box'); // var i = 0; // function show(){ // if(i<str.length){ // oBox.innerHTML = str.substring(0,++i); // 方法一 // // oBox.innerHTML += str.charAt(i++); // 方法二 // setTimeout(show,100); // } // } // show();
作业
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <input type="file" name="" id="files"> <button onclick="add()">提交</button> <body> <script> // 1.整理本周知识点和笔记 // 2.把今天我写的代码和案例，至少敲三遍。 // 3.周一课前测：获取数组中的最大值 和 冒泡排序 // 4.面试题：编写一个函数，按下面的输入内容和输出接结果编写 // function strChange(title){ // // 此次编写代码 // } // var resultStr = strChange("Hello*Books*world*hello"); // console.log(resultStr ) // 返回 “hello-books-world-world” // function b(center) { // // 将 * 替换为 - // var arr = center.replace(/[*]/g, '-'); // // 将每个单词的首字母小写 // var add = arr.split('-').map(two => { // return two.charAt(0).toLowerCase() + two.slice(1); // console.log(add); // }).join('-'); // return add; // } // var a = b("Hello*Books*world*hello"); // console.log(a); // 5.str="one two thr for fiv six" // 将字符串中所有的f换成F，并将字符串转成数组 // str="one two thr for fiv six"; // var add=str.replace(/f/g,'F'); // // console.log(add); // var arr=add.split(' '); // console.log(arr); // 6.扩展：创建一个按钮，点击上传图片，判断上传的文件是否是一张图片 // function add(){ // var file = document.getElementById('files'); // var pic = file.value;// 图片的路径 // var one = pic.split('.').pop(); // if(one=='png'||one=='pneg'||one=='jpg'||one=='jpeg'){ // alert('图片格式正确'); // }else{ // alert('格式不正确！'); // } // } // 7.实现函数：查找子字符串出现的次数 // 传入：”abcabcabc”,”abc” // 返回：3 // function add(arr){ // var one= arr.indexOf('abc'); // num=0; // while(one>=0){ // num++ // one=arr.indexOf('abc',one+1) // } // return num; // } // var arr=add('abcabcabcabcabcabc'); // console.log('abc一共出现'+num+'次'); // 8.写一个函数，对传入的字符串中每个单词的首字母大写， // 调用：capitalize(‘the quick brown fox’) // // 返回：The Quick Brown Fox // function a(arr) { // // 将每个单词的首字母大写 // var add = arr.split(' ').map(one => { // return one.charAt(0).toUpperCase() + one.slice(1); // // console.log(add); // }).join(' '); // return add; // } // var b = a("the quick brown fox"); // console.log(b); // 9.把字符串翻转 "kjihgfedcba" // var str = "abcdefghijk"; // var str = "abcdefghijk"; // var newArr=str.split(""); // var one= newArr.reverse(); // var two=one.join(''); // console.log(two); // 10.给定一个字符串，如：“abaasdffggghhjjkkgfddsssss3444343”，问题如下： // 1)字符串的长度 // 2) 取出指定位置的字符，如：0,3,5,9等 // 3) 查找指定字符是否在以上字符串中存在，如：i，c ，b等 // 4) 替换指定的字符，如：g替换为22,ss替换为b等操作方法 // 5) 截取指定开始位置到结束位置的字符串，如：取得1-5的字符串 // 6) 找出以上字符串中出现次数最多的字符和出现的次数 // 7) 遍历字符串，并将遍历出的字符两头添加符号“@” // 1)字符串的长度 // var add='abaasdffggghhjjkkgfddsssss3444343'; // console.log(add.length); // 2) 取出指定位置的字符，如：0,3,5,9等 // function one (add,num1){ // var num=[]; // for(var i=0;i<add.length;i++){ // if(i==num1){ // num.push(add[i]); // } // } // return num; // } // var add='abaasdffggghhjjkkgfddsssss3444343'; // var num1=0; // var num= one(add,num1); // console.log(num); // 3) 查找指定字符是否在以上字符串中存在，如：i，c ，b等 // var add='abaasdffggghhjjkkgfddsssss3444343'; // var num1='a'; // for(var i=0;i<add.length;i++){ // if(add[i]==num1 ){ // console.log(add[i]+'存在'); // } // } // 4) 替换指定的字符，如：g替换为22,ss替换为b等操作方法 // function a(add,num,newNum){ // var two= add.replace(new RegExp(num, 'g'),newNum); // return two; // } // var add='abaasdffggghhjjkkgfddsssss3444343'; // var num='s'; // var newNum="2"; // var one= a(add,num,newNum); // console.log(one); // 5) 截取指定开始位置到结束位置的字符串，如：取得1-5的字符串 // function one(add){ // var two= add.substring(start,end+1); // return two; // } // var end =5; // var start=1; // var add='abaasdffggghhjjkkgfddsssss3444343'; // var three=one(add) // console.log(three); // 6) 找出以上字符串中出现次数最多的字符和出现的次数 // var add='abaasdffggghhjjkkgfddsssss3444343'; // var newNum=[]; // for(var i=0;i<add.length;i++){ // var num=add[i]; // if(!newNum[num]){ // newNum[num]=1 // }else{ // newNum[num]++; // } // } // var maxname=0; // var max=''; // for(var num in newNum){ // if(newNum[num]>maxname){ // maxname=newNum[num]; // max=num; // } // } // console.log(maxname); // console.log(max); // 7) 遍历字符串，并将遍历出的字符两头添加符号“@” // var add = 'abaasdffggghhjjkkgfddsssss3444343'; // for (var i = 0; i, add.length; i++) { // var newAdd = '@' + add + "@"; // // } // console.log(newAdd); </script> </body> </html>
本文来自博客园，作者：刘先生的爱心博客，转载请注明原文链接：https://www.cnblogs.com/liu521125/p/17809525.html
一点一滴记录着学习html5 css3 和js 的时光
