5個典型的JavaScript面試任務:分析與解決方案

5個典型的JavaScript面試任務:分析與解決方案

來自譯者: 為您發表了一篇文章 Maria Antonietta Perna 談論典型的 JavaScript 任務,通常在面試期間提供給開發人員申請人。首先,這篇文章對於新手程式設計師來說是有用的。

科技公司的面試一直都是人們熱議的話題。這並不奇怪——成功通過面試就有機會獲得一份好工作。但事情並沒有那麼簡單,因為它常常需要解決複雜的問題。

此外,大多數情況下,這些任務中的大多數與申請人將要執行的工作無關,但仍需要解決。有時您必須在黑板上進行操作,而無需透過 Google 或任何其他來源進行檢查。是的,情況正在逐漸改變,有些公司正在放棄這樣的面試,但許多雇主仍然堅持這項傳統。本文致力於對求職者經常作為作業的典型 JavaScript 任務進行分析。

提醒: 對於“Habr”的所有讀者 - 使用“Habr”促銷代碼註冊任何 Skillbox 課程可享受 10 盧布的折扣。

技能箱推薦: 實踐課程 “移動開發者專業版”.

關鍵是要充分準備面試。

是的,在我們開始完成任務之前,讓我們先來看看一些準備面試的一般技巧。

最重要的是提前做好準備。 測試您對演算法和資料結構的記憶,並複習您不太熟悉的領域。有許多線上平台可以幫助您準備面試。我們建議 極客, 普拉普, 面試 и 代碼信號.

大聲說出決定是值得學習的。 建議告訴申請人您要做什麼,而不僅僅是寫在黑板上(或在電腦上輸入程式碼,也可以默默地)。這樣,如果您在程式碼中犯了錯誤,但解決方案通常是正確的,您就可以增加成功的機會。

在開始解決問題之前,需要先了解問題。 在某些情況下,您可能只是對任務有膚淺的理解,然後走上錯誤的道路。也許值得向面試官詢問一些澄清問題。

您需要練習手寫程式碼,而不是在電腦上。 有時,在面試期間,申請人會收到一支記號筆和一塊黑板,但沒有任何提示或自動格式化。當尋找解決方案時,值得將程式碼寫在紙上或直接寫在板上。如果你把所有事情都記在腦子裡,你可能會忘記一些重要的事情。

JavaScript 中的範本任務

其中一些任務您可能已經熟悉了。您要么在面試中遇到需要解決類似問題的情況,要么在學習 JavaScript 時練習過這些問題。好了,現在是時候再次解決它們了,並詳細解釋這個過程。

回文

回文是一個單字、句子或字元序列,無論以正常方向閱讀或以相反方向閱讀都完全相同。例如,「Anna」是回文,但「table」和「John」不是。

分期

給定一條線;您需要寫一個函數,如果字串是回文,則傳回 true,如果不是,則傳回 false。在這種情況下,您需要考慮空格和標點符號。

回文('racecar')=== true
回文('表')=== false

讓我們來分析一下這個任務

這裡的主要想法是反轉字串。如果「反向」字串與原始字串完全相同,那麼我們就有一個回文,並且函數應該傳回 true。如果不是,則為假。

解決方法

這是解決回文的程式碼。

const palindrome = str => {
  // turn the string to lowercase
  str = str.toLowerCase()
  // reverse input string and return the result of the
  // comparisong
  return str === str.split('').reverse().join('')
}

第一步是將輸入字串中的字元轉換為小寫。這保證了程式將比較字元本身,而不是大小寫或其他任何東西。

第二步,反轉線路。這很容易做到:您需要使用 .split() 方法(String 庫)將其轉換為陣列。然後我們使用.reverse()(數組庫)反轉數組。最後一步是使用 .join()(陣列庫)將反轉數組轉換為字串。

現在需要做的就是將“反向”字串與原始字串進行比較,傳回真或假的結果。

菲茲巴茲

最受歡迎的面試問題之一。

分期

你需要寫一個函數,將 1 到 n 的數字輸出到控制台,其中 n 是該函數接受作為參數的整數,並滿足以下條件:

  • 輸出 fizz 而不是 3 的倍數的數字;
  • 輸出蜂鳴聲而不是 5 的倍數的數字;
  • 輸出 fizzbuzz 而不是 3 和 5 的倍數的數字。

例子

菲茲巴茲(5)

導致

/ / 1
/ / 2
// 嘶嘶聲
/ / 4
// 嗡嗡聲

讓我們來分析一下這個任務

這裡的關鍵是使用 JavaScript 來找出數字的倍數的方法。它可以使用模數運算子或餘數運算子 - % 來實現,它允許您在除以兩個數字時顯示餘數。如果餘數為 0,則表示第一個數字是第二個數字的倍數。

12% 5 // 2 -> 12 不是 5 的倍數
12% 3 // 0 -> 12 是 3 的倍數

因此,如果將 12 除以 5,則結果為 2,餘數為 2。如果將 12 除以 3,則結果為 4,餘數為 0。在第一種情況下,12 不是 5 的倍數,在第二種情況下,12 是 3 的倍數。

解決方法

最佳解決方案是以下程式碼:

const fizzBuzz = num => {
  for(let i = 1; i <= num; i++) {
    // check if the number is a multiple of 3 and 5
    if(i % 3 === 0 && i % 5 === 0) {
      console.log('fizzbuzz')
    } // check if the number is a multiple of 3
      else if(i % 3 === 0) {
      console.log('fizz')
    } // check if the number is a multiple of 5
      else if(i % 5 === 0) {
      console.log('buzz')
    } else {
      console.log(i)
    }
  }
}

此函數使用條件運算子執行必要的檢查並產生使用者所需的結果。在問題中,值得注意的是 if...else 運算子的順序:以雙重條件(&&)開始,以找不到多個數字的情況結束。因此,我們涵蓋了所有選項。

字母異位詞

這是指包含另一個單字的所有字母的單字的名稱,其中字母數量相同,但順序不同。

分期

我們需要編寫一個函數來檢查兩個字串是否是字謎,並且字母的大小寫並不重要。僅計算符號;不考慮空格或標點符號。

anagram('finder', 'Friend') —> true
anagram('你好', '再見') —> false

讓我們來分析一下這個任務

重要的是要考慮到有必要檢查兩行輸入中的每個字母及其在每行中的數量。

查找器 —> f: 1 朋友 —> f: 1
我: 1 r: 1
n: 1 我: 1
d: 1 e: 1
e: 1 n: 1
r: 1 d: 1

要儲存字謎數據,您應該選擇一種結構,例如 JavaScript 物件文字。在這種情況下,鍵是一個字母符號,值是其在當前行中重複的次數。

還有其他條件:

  • 您需要確保比較不區分大小寫。只需將兩個字串都轉換為小寫或大寫即可。
  • 我們從比較中排除所有非符號。最好與 正規表示式.

解決方法

// helper function that builds the
// object to store the data
const buildCharObject = str => {
  const charObj = {}
  for(let char of str.replace(/[^w]/g).toLowerCase()) {
    // if the object has already a key value pair
    // equal to the value being looped over,
    // increase the value by 1, otherwise add
    // the letter being looped over as key and 1 as its value
    charObj[char] = charObj[char] + 1 || 1
  }
  return charObj
}
 
// main function
const anagram = (strA, strB) => {
  // build the object that holds strA data
  const aCharObject = buildCharObject(strA)
  // build the object that holds strB data
  const bCharObject = buildCharObject(strB)
 
  // compare number of keys in the two objects
  // (anagrams must have the same number of letters)
  if(Object.keys(aCharObject).length !== Object.keys(bCharObject).length) {
    return false
  }
  // if both objects have the same number of keys
  // we can be sure that at least both strings
  // have the same number of characters
  // now we can compare the two objects to see if both
  // have the same letters in the same amount
  for(let char in aCharObject) {
    if(aCharObject[char] !== bCharObject[char]) {
      return false
    }
  }
  // if both the above checks succeed,
  // you have an anagram: return true
  return true
}

注意使用 Object.keys() 在上面的程式碼片段中。此方法傳回一個數組,其中包含名稱或鍵,其順序與它們在物件中出現的順序相同。在這種情況下,數組將是這樣的:

['f', 'i', 'n', 'd', 'e', 'r']

這樣,我們就可以取得物件的屬性,而無需執行批次循環。在任務中,您可以將此方法與 .length 屬性一起使用來檢查兩個字串是否具有相同數量的字元 - 這是字謎的一個重要特徵。

搜尋元音

這是一個在面試中經常出現的相當簡單的任務。

分期

您需要編寫一個函數,該函數以字串作為參數並傳回字串中包含的元音的數量。
元音是“a”,“e”,“i”,“o”,“u”。

示例:

findVowels('hello') // —> 2
findVowels('為什麼') // —> 0

解決方法

這是最簡單的選擇:

const findVowels = str => {
  let count = 0
  const vowels = ['a', 'e', 'i', 'o', 'u']
  for(let char of str.toLowerCase()) {
    if(vowels.includes(char)) {
      count++
    }
  }
  return count
}

需要注意的是.includes() 方法的使用。它適用於字串和數組。它應該用於查明數組是否包含某個值。如果陣列包含指定值,則此方法傳回 true,否則傳回 false。

這個問題還有一個更簡短的解決方案:

const findVowels = str => {
  const matched = str.match(/[aeiou]/gi)
  return matched ? matches.length : 0
}

這裡使用了.match()方法,可以實現高效率的搜尋。如果在指定的字串中找到作為方法參數的正規表示式,則傳回值是符合字元的陣列。好吧,如果沒有匹配,那麼 .match() 將返回 null。

斐波那契

各層級的面試都會遇到的經典任務。值得記住的是,斐波那契數列是一系列數字,其中每個後續數字都是前兩個數字的總和。因此,前十個數字如下:0、1、1、2、3、5、8、13、21、34。

分期

您需要編寫一個函數,傳回特定序列中的第 n 個條目,其中 n 是作為參數傳遞給該函數的數字。

斐波那契(3) // —> 2

此任務涉及循環執行參數指定的次數,並傳回適當位置的值。這種表述問題的方式需要使用循環。如果你使用遞歸,它可能會讓面試官感到高興,並給你加分。

解決方法

const fibonacci = num => {
  // store the Fibonacci sequence you're going
  // to generate inside an array and
  // initialize the array with the first two
  // numbers of the sequence
  const result = [0, 1]
 
  for(let i = 2; i <= num; i++) {
    // push the sum of the two numbers
    // preceding the position of i in the result array
    // at the end of the result array
    const prevNum1 = result[i - 1]
    const prevNum2 = result[i - 2]
    result.push(prevNum1 + prevNum2)
  }
  // return the last value in the result array
  return result[num]
}

在結果陣列中,前兩個數字包含在一行中,因為序列中的每個項目都由前兩個數字的總和組成。一開始沒有兩個數字可以取來得到下一個數字,所以循環無法自動產生它們。但是,我們知道,前兩個數字始終是 0 和 1。因此,可以手動初始化結果數組。

至於遞歸,一切都變得更簡單,同時也更複雜:

const fibonacci = num => {
  // if num is either 0 or 1 return num
  if(num < 2) {
    return num
  }
  // recursion here
  return fibonacci(num - 1) + fibonacci(num - 2)
}

我們不斷呼叫 fibonacci(),並將越來越小的數字傳遞為參數。當傳遞的參數為 0 或 1 時,我們停止。

產量

如果您曾經面試過前端或 JavaScript 開發人員職位(尤其是初級職位),那麼您很可能會遇到其中一些挑戰。但即使你沒有遇到它們,它們在未來也可能會派上用場——至少對於一般的發展而言。

技能箱推薦:

來源: www.habr.com

為具有 DDoS 保護、VPS VDS 服務器的站點購買可靠的主機 🔥 購買具備 DDoS 防護的可靠網站寄存服務,包括 VPS 和 VDS 伺服器 | ProHoster