摘要:希望索引值之間用隔開,而最后的索引值后面無。優化代碼這個判斷用于防止最后一個索引值后面還有結果查看其實用來跳出循環一直覺得不太規范。。。小實驗是顯示次數其實就是那個索引值啦,這次顯示的是字符哦涉及到字符,就要用到方法。
第一篇技術文章寫些簡單點的~
在大三上web前端開發課程時,雖然能用JavaScript制作一些簡單的頁面動態效果,但其實很多JS知識并未掌握,所以自己又通過視頻再復習一次JS。(我的JS書籍還在來的路上,在此之前,讓我先用“在線課程”這種快餐充饑~)
JS內置對象中String字符串對象有太多方法了,今天通過2個簡單實驗,熟悉indexOf()、lastIndexOf()、charAt()3個方法的使用。
首先來看看w3school里是怎么介紹indexOf()的
語法:
Object(string|array).indexOf(searchValue, fromIndex);
用法:
返回某個指定的字符串值在字符串中首次出現的位置
兩大參數:
參數1 searchValue 必需。規定需檢索的字符串值
參數2 fromIndex 可選。規定在字符串中開始檢索的位置。它的合法取值是0到stringObject.length-1。如省略該參數,則將從字符串的首字符開始檢索。
然后學習時所給demo實在是太簡單了吧。。-.-!!!
第一個由于原字符串有此一系列完整且連續的字符,于是輸出位置為6,注意空格也占一個字符位置哦~
第二個由于沒有,所以輸出-1
這里注意了~返回值是數字(索引),在后面提及的小實驗中索引index的定義非常關鍵。
---------------小實驗1---------------實在接受不了如此直白的demo,于是仔細想想到底這個方法能用來做什么?
下面是一個我覺得很有效但自己卻很少用到的深入學習法
1、indexOf是找到首次出現的位置。。(首先多次理解這個定義)
2、那如果這是一個游戲。。(從感興趣的方向作為切入點,聯想實際生活)
3、游戲規則是需要找出一句話中"l"字母出現的所有位置。。(將其具體化)
而indexOf()只會找一次,那要如何設計?
于是二話不說,幾行代碼就寫出來了,非常的迅速!
刷新頁面一看,oh my god?。ㄏ旅媸沁\行結果)
22222222222
這么簡單的程序都不會寫,真得好好檢討一下!T.T
問題出在哪里呢?首先是定義一個字符串str,然后for循環讓它每找到一個"l"字母就輸出該字母所在位置,但是為何每次都輸出2?
沒錯,關鍵就是那個index索引!
愚蠢的我以為i++就代表起始查找位置在后移,其實真正起作用的是索引index。
另外,還有一點!就是indexOf()方法中的參數2,剛才我的錯誤代碼中,indexOf()是只有參數1的,參數2默認為字符串首字符位置,即要從頭開始尋找。
又沒有索引值,又每次都得從頭找,還要for循環,不出現一堆2才怪呢~
正確做法結果如下:
239
但是這樣并不好看,嘗試優化。希望索引值之間用“、”隔開,而最后的索引值后面無“、”。這時需要用到indexOf()的兄弟方法lastIndexOf(),只要記住用法和indexOf()完全相反,省略參數2則從字符串最后一個字符開始尋找,直到找到指定字符的最后出現位置。
優化代碼:
結果查看:
2、3、9
其實用break來跳出循環一直覺得不太規范。。。網上看到有用do-while()方法感覺更好。。
PS:要注意indexOf()對大小寫要求很高,一開始沒留意,寫成indexof(),一直沒效果,后來才發現原來o要大寫。。香菇~ ---------------小實驗2---------------如果將游戲顯示簡化一點又要怎么設計呢?現在已有的游戲規則是數有多少個"l"字母,然后說出每個的位置。
現在增加難度,要顯示次數最多的字符。
小實驗1是顯示次數(其實就是那個索引值啦0.0),這次顯示的是字符哦~涉及到字符,就要用到charAt()方法。
同樣的,首先在看看w3school有什么想說的
語法:
stringObject.charAt(index);
用法:
返回指定位置的字符
參數:
index 必需。表示字符串中某個位置的數字,即字符在字符串中的下標。
這一次涉及到for in的用法,這里要和for循環做一個區分。
for - 循環代碼塊一定的次數 for/in - 循環遍歷對象的屬性
遍歷對象的屬性,在這次實驗里,由于要找出哪個字符次數最多,所以要遍歷的是字符(對象)的次數(屬性)。
簡單例子:
var a=["aa","bb","cc"]; for(var c in a){ document.write(a[c]); }
結果為:
aabbcc
在了解for in用法后開始編寫~
思路如下:
1、首先得創建一個對象obj
2、for循環時用charAt()方法把每個字符塞到char中,obj[char]相當于“該字符的次數”
3、每次循環時更新對應字符次數
4、定義次數最多的字符max
5、for in循環遍歷次數,與obj里每個字母對應的次數進行比較,輸出最多次數所對應的字符
展示各個字符及對應的次數,代碼如下:
輸出結果:
h:1 次 e:1 次 l:1 次 l:2 次 o:1 次 :1 次 w:1 次 o:2 次 r:1 次 l:3 次 d:1 次
可以說實驗2已經完成了一半,接下來是for in循環遍歷次數,找次數最多的出來!后續代碼如下:
var max=0;//次數最多,初始化為0,防止undefined var maxChar; for(char in obj){ if(max次數最多的字符是"+maxChar); document.write("
一共出現了"+max+" 次");
看起來行得通,結果卻不盡如人意啊T.T
次數最多的字符是d 一共出現了3 次
為什么次數最多的字符是d。。。但又竟然是3次??明明d只出現1次,而l才是出現了3次。。咋就混在一起了呢。。。當時的我竟然想笑。。。
仔細回看代碼,會發現if-else語句有點奇怪,按順序執行的話,"hello world"首先是h字母次數,次數為1,max 換言之,根本不需要else語句,當更新max的同時,也要更新maxChar,對號入座,才不會有“牛頭不搭馬嘴”這種尷尬情況的發生。。。 完整代碼如下:(由于我們要的只是最終結果,所以“列舉每個字母及對應的次數”這一步可省略) 第一篇文章就用了我3小時。。。只想說一句。。好累!雖然這只是JS中一個很小的知識,不過還是挺有意義的~ 最后感謝博客園用戶!master的這篇文章,js--找字符串中出現最多的字符,實在沒想到有人會和我想到一塊去了。實驗2就是受這篇文章的啟發的。
————WEB前端學習,需要我們多看書多敲碼多思考
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://m.specialneedsforspecialkids.com/yun/91126.html
摘要:最近在看語言精粹這本書,建立完整的知識體系。一關于語言是一門未在實驗室打磨過的語言,存在這很多考慮不全面甚至,因此我們很有必要學習本書,已達到去除糟粕,取其精華的效果。則為定義了,為初始化的變量。為對象,數組函數均屬于特殊的對象。 最近在看JavaScript語言精粹這本書,建立完整的js知識體系。 一.關于JavaScript語言js是一門未在實驗室打磨過的語言,存在這很多考慮不全面...
摘要:固有對象由標準規定,隨著運行時創建而自動創建的對象實例。普通對象由語法構造器或者關鍵字定義類創建的對象,它能夠被原型繼承。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱:ka...
摘要:固有對象由標準規定,隨著運行時創建而自動創建的對象實例。普通對象由語法構造器或者關鍵字定義類創建的對象,它能夠被原型繼承。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱:ka...
摘要:固有對象由標準規定,隨著運行時創建而自動創建的對象實例。普通對象由語法構造器或者關鍵字定義類創建的對象,它能夠被原型繼承。 筆記說明 重學前端是程劭非(winter)【前手機淘寶前端負責人】在極客時間開的一個專欄,每天10分鐘,重構你的前端知識體系,筆者主要整理學習過程的一些要點筆記以及感悟,完整的可以加入winter的專欄學習【原文有winter的語音】,如有侵權請聯系我,郵箱:ka...
閱讀 2390·2021-11-15 11:37
閱讀 2639·2021-09-23 11:21
閱讀 2968·2021-09-07 10:11
閱讀 3176·2019-08-30 15:53
閱讀 2835·2019-08-29 15:13
閱讀 1618·2019-08-26 13:57
閱讀 1112·2019-08-26 12:23
閱讀 2452·2019-08-26 11:51