前幾天去萬科的一個團(tuán)隊(duì)面試，面試官問的幾個小題有點(diǎn)意思，回來思考后做一些解析
1纳令，如何實(shí)現(xiàn)查找字符串里面出現(xiàn)次數(shù)最多的那個字符，他出現(xiàn)了幾次克胳，出現(xiàn)在哪位平绩？
當(dāng)時我認(rèn)為應(yīng)該拆分為數(shù)組進(jìn)行對比(類似去重的思路)，但是發(fā)現(xiàn)這樣會出現(xiàn)其他問題漠另，一時思路非衬蟠疲混亂，導(dǎo)致答得非常不好笆搓⌒允回來后查閱一些答案，找到比較好的解法满败，但是這些答案基本只告訴你這樣做肤频，不會從更原理層的告訴你為什么可以這樣做。下面會分析一個解法算墨。
首先答案給出一個判斷函數(shù)宵荒。
function check(str) {
? ? ? ? ?var temp = {}
? ? ? ? ?var max = 0;
? ? ? ? for(var i=0; i
? ? ? ? ? ? var slogan = str[i];
? ? ? ? ? ? if(temp[slogan]){
? ? ? ? ? ? ? ? temp[slogan]++
? ? ? ? ? ? ? }else{
? ? ? ? ? ? ? ? temp[slogan] = 1
? ? ? ? ? ? ? }
? ? ? ? ? ? }
//這個函數(shù)可以簡單的返回{x:1,y:2}? x，y為鍵值對，1报咳，2為出現(xiàn)次數(shù)侠讯。
相信看到這里你一定會想str[i]不是一個字符串嗎，那temp[‘字符串’]判斷為真是個什么鬼暑刃，++是搞啥用的厢漩？
這里就涉及到一個對象屬性的問題。
我找到來自stackoverflow的一個解釋
理解：Javascript的數(shù)組其實(shí)不像PHP或者其他一些語言一樣擁有真正的字符串下標(biāo)岩臣，當(dāng)我們試圖為一個js數(shù)組添加字符串下標(biāo)的時候溜嗜，其實(shí)就相當(dāng)于為該數(shù)組對象添加了一個屬性，屬性名稱就是我們所謂的“字符串下標(biāo)”婿脸。由于為數(shù)組對象添加屬性不會影響到同為該對象屬性的length的值粱胜，因此該值將始終為零。
也就是說當(dāng)你遍歷temp[‘字符串’]的時候狐树，他也就是undefined焙压， 而因?yàn)镴avaScript的undefined 不等于true ，所以這里他會走else分支抑钟，而因?yàn)槲覀冞@里給他設(shè)置為temp[slogan] = 1涯曲。所以他成為一個屬性進(jìn)入temp對象 ，此時temp對象應(yīng)該是這樣的 { 字符串:? 1? }
而如果這個值有重復(fù)temp[‘字符串’]在塔，則會直接返回一個對象里面鍵值名相同的值 幻件，視為你在temp對象里面查找他嘛，很好理解蛔溃，這里就會返回temp{字符串:1}绰沥，當(dāng)然如果這里找到了那么自然就走判斷正確的分支，那么這里就是temp{字符串:2}
同理這樣這個函數(shù)就完成了查找字符串里面最大值的作用贺待，那么下面我們就要把最大值輸出并完成其他要求徽曲。
? ? ? ? ? ? for(var key in temp) {
? ? ? ? ? ? ? ? if(max <temp[key])
? ? ? ? ? ? ? ? ? ? ?max = temp[key];
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }
這里就是暴力遍歷的和temp鍵值的數(shù)值進(jìn)行比較，得出最大值麸塞。下面就根據(jù)我們找到的最大值和鍵值進(jìn)行對比秃臣，indexOf找到所屬位置，到此這個函數(shù)也就結(jié)束了哪工。例外情況: 當(dāng)出現(xiàn)兩個字符次數(shù)想等的情況下奥此，根據(jù)最后的遍歷結(jié)果我們能猜到，此函數(shù)會直接把兩個結(jié)果打印出來雁比。
? ? ? ? ? ? for(var key in temp) {
? ? ? ? ? ? ? ? if(max==temp[key]){
? ? ? ? ? ? ? ? ? ? console.log("最多的字符是" + key);
? ? ? ? ? ? ? ? ? ? console.log("他首次出現(xiàn)在數(shù)組的第"+ parseFloat(str.indexOf(key)+1)+"位")
? ? ? ? ? ? ? ? ? ? console.log("出現(xiàn)的次數(shù)是" + max);
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }
? ? ? ? }
? ? ? ? var str = 'helloworld'
? ? ? ? check(str)
其他小問題
2稚虎，slot插槽怎么理解
最重要的作用是 增強(qiáng)了組件的可配置性，曾經(jīng)在公司一個項(xiàng)目使用過這方面偎捎，但其實(shí)發(fā)現(xiàn)用其他方法也可以實(shí)現(xiàn)祥绞。
3非洲，flex布局實(shí)現(xiàn)一排3個同等大小的div，左邊和右邊的div距離中間的div1穩(wěn)定保持為10px(簡單)
4,? ?vue keep-alive的兩個vue內(nèi)置鉤子 ：activated?和?deactivated
5蜕径，面向?qū)ο罄斫?/p>
嗯，玄學(xué)
總的來說面試官問的問題可能某些比較刁鉆败京，開發(fā)可能也遇不到兜喻，但是比較考驗(yàn)的是JavaScript基礎(chǔ)知識的認(rèn)知，例如如上對象的一些屬性特征赡麦，還是要學(xué)習(xí)一個啊朴皆。
不過這些也還好，比起用es5實(shí)現(xiàn)一個object.create()還要簡單一些的～笑泛粹，(廣州某公司題目)
---------------update 5.10 --------------
隔了好久遂铡，發(fā)現(xiàn)現(xiàn)在實(shí)現(xiàn)它已經(jīng)不用當(dāng)時那么蛋疼的方法，而且更為快速了
var str = 'dsfjkskfjskfjksdjkfsjk23322332'
var changeStr = str.split('')
var obj = {}
changeStr.reduce((prev, cur) => {
? ? obj[cur] ? obj[cur]+=1 : obj[cur] = 1
? ? return prev
})
var max = {
? ?value: 0,
? ?key: ''
}
for(const [key, value] of Object.entries(obj)) {
? ? if (max.value < value) {
? ? ? ? max.value = value?
? ? ? ? max.key = key
? }
}
