摘要：希望索引值之間用隔開(kāi)，而最后的索引值后面無(wú)。優(yōu)化代碼這個(gè)判斷用于防止最后一個(gè)索引值后面還有結(jié)果查看其實(shí)用來(lái)跳出循環(huán)一直覺(jué)得不太規(guī)范。。。小實(shí)驗(yàn)是顯示次數(shù)其實(shí)就是那個(gè)索引值啦，這次顯示的是字符哦涉及到字符，就要用到方法。

第一篇技術(shù)文章寫(xiě)些簡(jiǎn)單點(diǎn)的~
在大三上web前端開(kāi)發(fā)課程時(shí)，雖然能用JavaScript制作一些簡(jiǎn)單的頁(yè)面動(dòng)態(tài)效果，但其實(shí)很多JS知識(shí)并未掌握，所以自己又通過(guò)視頻再?gòu)?fù)習(xí)一次JS。（我的JS書(shū)籍還在來(lái)的路上，在此之前，讓我先用“在線課程”這種快餐充饑~）

JS內(nèi)置對(duì)象中String字符串對(duì)象有太多方法了，今天通過(guò)2個(gè)簡(jiǎn)單實(shí)驗(yàn)，熟悉indexOf()、lastIndexOf()、charAt()3個(gè)方法的使用。

首先來(lái)看看w3school里是怎么介紹indexOf()的

語(yǔ)法：

Object(string|array).indexOf(searchValue, fromIndex);

用法：

返回某個(gè)指定的字符串值在字符串中首次出現(xiàn)的位置

兩大參數(shù)：

參數(shù)1 searchValue 必需。規(guī)定需檢索的字符串值 
參數(shù)2 fromIndex 可選。規(guī)定在字符串中開(kāi)始檢索的位置。它的合法取值是0到stringObject.length-1。如省略該參數(shù)，則將從字符串的首字符開(kāi)始檢索。

然后學(xué)習(xí)時(shí)所給demo實(shí)在是太簡(jiǎn)單了吧。。-.-!!!

第一個(gè)由于原字符串有此一系列完整且連續(xù)的字符，于是輸出位置為6，注意空格也占一個(gè)字符位置哦~
第二個(gè)由于沒(méi)有，所以輸出-1

這里注意了~返回值是數(shù)字(索引)，在后面提及的小實(shí)驗(yàn)中索引index的定義非常關(guān)鍵。

實(shí)在接受不了如此直白的demo，于是仔細(xì)想想到底這個(gè)方法能用來(lái)做什么？
下面是一個(gè)我覺(jué)得很有效但自己卻很少用到的深入學(xué)習(xí)法
1、indexOf是找到首次出現(xiàn)的位置。。（首先多次理解這個(gè)定義）
2、那如果這是一個(gè)游戲。。（從感興趣的方向作為切入點(diǎn)，聯(lián)想實(shí)際生活）
3、游戲規(guī)則是需要找出一句話中"l"字母出現(xiàn)的所有位置。。（將其具體化）

而indexOf()只會(huì)找一次，那要如何設(shè)計(jì)？

于是二話不說(shuō)，幾行代碼就寫(xiě)出來(lái)了，非常的迅速！

刷新頁(yè)面一看，oh my god?。ㄏ旅媸沁\(yùn)行結(jié)果）

22222222222

這么簡(jiǎn)單的程序都不會(huì)寫(xiě)，真得好好檢討一下！T.T

問(wèn)題出在哪里呢？首先是定義一個(gè)字符串str，然后for循環(huán)讓它每找到一個(gè)"l"字母就輸出該字母所在位置，但是為何每次都輸出2？

沒(méi)錯(cuò)，關(guān)鍵就是那個(gè)index索引！
愚蠢的我以為i++就代表起始查找位置在后移，其實(shí)真正起作用的是索引index。
另外，還有一點(diǎn)！就是indexOf()方法中的參數(shù)2，剛才我的錯(cuò)誤代碼中，indexOf()是只有參數(shù)1的，參數(shù)2默認(rèn)為字符串首字符位置，即要從頭開(kāi)始尋找。

又沒(méi)有索引值，又每次都得從頭找，還要for循環(huán)，不出現(xiàn)一堆2才怪呢~

結(jié)果如下：

239

但是這樣并不好看，嘗試優(yōu)化。希望索引值之間用“、”隔開(kāi)，而最后的索引值后面無(wú)“、”。這時(shí)需要用到indexOf()的兄弟方法lastIndexOf()，只要記住用法和indexOf()完全相反，省略參數(shù)2則從字符串最后一個(gè)字符開(kāi)始尋找，直到找到指定字符的最后出現(xiàn)位置。

優(yōu)化代碼：

結(jié)果查看：

2、3、9

其實(shí)用break來(lái)跳出循環(huán)一直覺(jué)得不太規(guī)范。。。網(wǎng)上看到有用do-while()方法感覺(jué)更好。。

如果將游戲顯示簡(jiǎn)化一點(diǎn)又要怎么設(shè)計(jì)呢？現(xiàn)在已有的游戲規(guī)則是數(shù)有多少個(gè)"l"字母，然后說(shuō)出每個(gè)的位置。
現(xiàn)在增加難度，要顯示次數(shù)最多的字符。

小實(shí)驗(yàn)1是顯示次數(shù)（其實(shí)就是那個(gè)索引值啦0.0），這次顯示的是字符哦~涉及到字符，就要用到charAt()方法。

同樣的，首先在看看w3school有什么想說(shuō)的

語(yǔ)法：

stringObject.charAt(index);

用法：

返回指定位置的字符

參數(shù)：

index 必需。表示字符串中某個(gè)位置的數(shù)字，即字符在字符串中的下標(biāo)。

這一次涉及到for in的用法，這里要和for循環(huán)做一個(gè)區(qū)分。

for - 循環(huán)代碼塊一定的次數(shù)
for/in - 循環(huán)遍歷對(duì)象的屬性

遍歷對(duì)象的屬性，在這次實(shí)驗(yàn)里，由于要找出哪個(gè)字符次數(shù)最多，所以要遍歷的是字符（對(duì)象）的次數(shù)（屬性）。

簡(jiǎn)單例子：

var a=["aa","bb","cc"];
for(var c in a){
    document.write(a[c]);
}

結(jié)果為：

aabbcc

在了解for in用法后開(kāi)始編寫(xiě)~
思路如下：
1、首先得創(chuàng)建一個(gè)對(duì)象obj
2、for循環(huán)時(shí)用charAt()方法把每個(gè)字符塞到char中，obj[char]相當(dāng)于“該字符的次數(shù)”
3、每次循環(huán)時(shí)更新對(duì)應(yīng)字符次數(shù)
4、定義次數(shù)最多的字符max
5、for in循環(huán)遍歷次數(shù)，與obj里每個(gè)字母對(duì)應(yīng)的次數(shù)進(jìn)行比較，輸出最多次數(shù)所對(duì)應(yīng)的字符

展示各個(gè)字符及對(duì)應(yīng)的次數(shù)，代碼如下：

輸出結(jié)果：

h:1 次
e:1 次
l:1 次
l:2 次
o:1 次
:1 次
w:1 次
o:2 次
r:1 次
l:3 次
d:1 次

可以說(shuō)實(shí)驗(yàn)2已經(jīng)完成了一半，接下來(lái)是for in循環(huán)遍歷次數(shù)，找次數(shù)最多的出來(lái)！后續(xù)代碼如下：

var max=0;//次數(shù)最多，初始化為0，防止undefined
 var maxChar;
 for(char in obj){
     if(max次數(shù)最多的字符是"+maxChar);
 document.write("
一共出現(xiàn)了"+max+" 次");

看起來(lái)行得通，結(jié)果卻不盡如人意啊T.T

次數(shù)最多的字符是d
一共出現(xiàn)了3 次

為什么次數(shù)最多的字符是d。。。但又竟然是3次？？明明d只出現(xiàn)1次，而l才是出現(xiàn)了3次。。咋就混在一起了呢。。。當(dāng)時(shí)的我竟然想笑。。。

仔細(xì)回看代碼，會(huì)發(fā)現(xiàn)if-else語(yǔ)句有點(diǎn)奇怪，按順序執(zhí)行的話，"hello world"首先是h字母次數(shù)，次數(shù)為1，max

換言之，根本不需要else語(yǔ)句，當(dāng)更新max的同時(shí)，也要更新maxChar，對(duì)號(hào)入座，才不會(huì)有“牛頭不搭馬嘴”這種尷尬情況的發(fā)生。。。

完整代碼如下：（由于我們要的只是最終結(jié)果，所以“列舉每個(gè)字母及對(duì)應(yīng)的次數(shù)”這一步可省略）

第一篇文章就用了我3小時(shí)。。。只想說(shuō)一句。。好累！雖然這只是JS中一個(gè)很小的知識(shí)，不過(guò)還是挺有意義的~

最后感謝博客園用戶(hù)!master的這篇文章，js--找字符串中出現(xiàn)最多的字符，實(shí)在沒(méi)想到有人會(huì)和我想到一塊去了。實(shí)驗(yàn)2就是受這篇文章的啟發(fā)的。

                                                                   ————WEB前端學(xué)習(xí)，需要我們多看書(shū)多敲碼多思考