5 งานสัมภาษณ์ JavaScript ทั่วไป: การวิเคราะห์และการแก้ปัญหา

จากผู้แปล: เผยแพร่บทความสำหรับคุณ Maria Antonietta Perna ผู้ซึ่งพูดถึงงาน JavaScript ทั่วไปซึ่งส่วนใหญ่มักเสนอให้กับผู้สมัครนักพัฒนาในระหว่างการสัมภาษณ์ บทความนี้จะเป็นประโยชน์สำหรับโปรแกรมเมอร์มือใหม่เป็นอันดับแรก

การสัมภาษณ์บริษัทเทคโนโลยีถือเป็นประเด็นพูดคุยกันมานานแล้ว จึงไม่น่าแปลกใจเลยที่การผ่านการสัมภาษณ์จะทำให้คุณมีโอกาสได้งานดีๆ แต่นี่ไม่ใช่เรื่องง่ายนัก เนื่องจากปัญหาที่ซับซ้อนมักจะต้องได้รับการแก้ไข

นอกจากนี้บ่อยครั้งที่งานเหล่านี้ส่วนใหญ่ไม่เกี่ยวข้องกับงานที่ผู้สมัครจะดำเนินการ แต่ยังต้องแก้ไข บางครั้งคุณต้องทำบนกระดานโดยไม่ต้องตรวจสอบกับ Google หรือแหล่งข้อมูลอื่นใด ใช่ สถานการณ์กำลังค่อยๆ เปลี่ยนไป และบางบริษัทก็ละทิ้งการสัมภาษณ์ดังกล่าว แต่นายจ้างจำนวนมากยังคงยึดถือประเพณีนี้ บทความนี้มีเนื้อหาเกี่ยวกับการวิเคราะห์งาน JavaScript ทั่วไปที่มักใช้เป็นงานสำหรับผู้หางาน

เราเตือนคุณ: สำหรับผู้อ่าน "Habr" ทุกคน - ส่วนลด 10 rubles เมื่อลงทะเบียนในหลักสูตร Skillbox ใด ๆ โดยใช้รหัสส่งเสริมการขาย "Habr"

Skillbox แนะนำ: หลักสูตรภาคปฏิบัติ "นักพัฒนามือถือ PRO".

สิ่งสำคัญคือการเตรียมตัวให้พร้อมสำหรับการสัมภาษณ์ของคุณอย่างละเอียด

ใช่ ก่อนที่เราจะเริ่มพิจารณางาน เรามาดูเคล็ดลับทั่วไปในการเตรียมตัวสัมภาษณ์กันก่อน

สิ่งสำคัญคือการเตรียมตัวล่วงหน้า ทดสอบว่าคุณจำอัลกอริธึมและโครงสร้างข้อมูลได้ดีเพียงใด และพัฒนาความรู้ในด้านที่คุณไม่คุ้นเคยมากนัก มีแพลตฟอร์มออนไลน์มากมายที่สามารถช่วยคุณเตรียมตัวสำหรับการสัมภาษณ์ได้ เราแนะนำ เกินบรรยาย, รถเข็น, สัมภาษณ์.io и รหัสสัญญาณ.

การเรียนรู้ที่จะพูดการตัดสินใจออกมาดังๆ เป็นสิ่งที่คุ้มค่า ขอแนะนำให้บอกผู้สมัครเกี่ยวกับสิ่งที่คุณทำ ไม่ใช่แค่เขียนบนกระดาน (หรือพิมพ์รหัสลงในคอมพิวเตอร์อย่างเงียบๆ ด้วย) ด้วยวิธีนี้ หากคุณทำรหัสผิดพลาด แต่โดยทั่วไปแล้ววิธีแก้ปัญหามีความถูกต้อง คุณสามารถเพิ่มโอกาสในการประสบความสำเร็จได้

คุณต้องเข้าใจปัญหาก่อนที่จะเริ่มแก้ไข ในบางกรณี คุณอาจเข้าใจงานอย่างผิวเผินแล้วเดินไปผิดทาง มันอาจจะคุ้มค่าที่จะถามคำถามเพื่อชี้แจงกับผู้สัมภาษณ์

คุณต้องฝึกเขียนโค้ดด้วยมือ ไม่ใช่บนพีซี มันเกิดขึ้นว่าในระหว่างการสัมภาษณ์ ผู้สมัครจะได้รับเครื่องหมายและไวท์บอร์ด ซึ่งไม่มีคำแนะนำหรือการจัดรูปแบบอัตโนมัติ เมื่อมองหาวิธีแก้ปัญหา คุณควรจดโค้ดของคุณลงบนกระดาษหรือบนกระดานโดยตรง หากคุณเก็บทุกอย่างไว้ในหัว คุณอาจลืมบางสิ่งที่สำคัญได้

งานเทมเพลตใน JavaScript

งานเหล่านี้บางส่วนอาจคุ้นเคยกับคุณอยู่แล้ว คุณเคยมีการสัมภาษณ์ที่คุณต้องแก้ปัญหาบางอย่างที่คล้ายกัน หรือฝึกฝนในขณะที่เรียนรู้ JavaScript ตอนนี้ได้เวลาแก้ไขอีกครั้งพร้อมคำอธิบายโดยละเอียดของกระบวนการ

พาลินโดรม

พาลินโดรมคือคำ ประโยค หรือลำดับของอักขระที่อ่านเหมือนกันทุกประการทั้งในทิศทางปกติและในทิศทางตรงกันข้าม ตัวอย่างเช่น “Anna” เป็นพาลินโดรม แต่ “table” และ “John” ไม่ใช่

การผลิต

ให้สตริง; คุณต้องเขียนฟังก์ชันที่ให้คุณคืนค่าจริงหากสตริงเป็นพาลินโดรม และคืนค่าเป็นเท็จหากไม่ใช่ ในกรณีนี้ คุณต้องคำนึงถึงการเว้นวรรคและเครื่องหมายวรรคตอนด้วย

palindrome('รถแข่ง') === จริง
palindrome('ตาราง') === เท็จ

มาวิเคราะห์งานกัน

แนวคิดหลักที่นี่คือ การย้อนกลับสตริง หากสตริง "ย้อนกลับ" เหมือนกับสตริงดั้งเดิมโดยสิ้นเชิง แสดงว่าเราได้รับพาลินโดรมและฟังก์ชันควรส่งคืนค่าจริง ถ้าไม่เป็นเท็จ

การตัดสิน

นี่คือรหัสที่ใช้แก้พาลินโดรม

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() (ไลบรารีอาร์เรย์)

ตอนนี้สิ่งที่คุณต้องทำคือเปรียบเทียบสตริง "ย้อนกลับ" กับสตริงเดิม โดยส่งคืนผลลัพธ์จริงหรือเท็จ

FizzBuzz

หนึ่งในงานยอดนิยมในการสัมภาษณ์

การผลิต

คุณต้องเขียนฟังก์ชันที่พิมพ์ตัวเลขตั้งแต่ 1 ถึง n ไปยังคอนโซล โดยที่ n คือจำนวนเต็มที่ฟังก์ชันใช้เป็นพารามิเตอร์ โดยมีเงื่อนไขดังต่อไปนี้:

• เอาต์พุตเป็นฟองแทนที่จะเป็นทวีคูณของ 3;
• เอาต์พุต buzz แทนตัวเลขที่เป็นทวีคูณของ 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: เริ่มต้นด้วยเงื่อนไขคู่ (&&) และลงท้ายด้วยกรณีที่ไม่พบตัวเลขหลายตัว ด้วยเหตุนี้ เราจึงครอบคลุมตัวเลือกทั้งหมด

แอนนาแกรม

นี่คือชื่อของคำที่มีตัวอักษรทั้งหมดของคำอื่นในตัวเลขเดียวกัน แต่เรียงลำดับต่างกัน

การผลิต

เราจำเป็นต้องเขียนฟังก์ชันที่ตรวจสอบว่าสองสายเป็นแอนนาแกรมหรือไม่ และตัวพิมพ์ไม่สำคัญ นับเฉพาะตัวอักษรเท่านั้น การเว้นวรรคหรือเครื่องหมายวรรคตอนจะไม่นำมาพิจารณา

แอนนาแกรม ('ค้นหา', 'เพื่อน') —> จริง
แอนนาแกรม ('สวัสดี', 'ลาก่อน') -> เท็จ

มาวิเคราะห์งานกัน

สิ่งสำคัญที่ต้องพิจารณาที่นี่คือคุณต้องตรวจสอบตัวอักษรแต่ละตัวในบรรทัดอินพุตสองบรรทัดและหมายเลขในแต่ละบรรทัด

ตัวค้นหา —> f: เพื่อน 1 คน —> f: 1
ผม: 1 ร: 1
น: 1 และ: 1
ง: 1 จ: 1
จ: 1 น: 1
ร: 1 วัน: 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
}

ใส่ใจการใช้งาน วัตถุ.คีย์() ในตัวอย่างด้านบน วิธีนี้จะส่งคืนอาร์เรย์ที่มีชื่อหรือคีย์ในลำดับเดียวกับที่ปรากฏในออบเจ็กต์ ในกรณีนี้อาร์เรย์จะเป็นดังนี้:

['f', 'ฉัน', 'n', 'd', 'e', ​​​​'r']

วิธีนี้ทำให้เราได้รับคุณสมบัติของวัตถุโดยไม่ต้องทำการวนซ้ำจำนวนมาก ในปัญหา คุณสามารถใช้เมธอดนี้กับคุณสมบัติ .length เพื่อตรวจสอบว่าสตริงทั้งสองมีจำนวนอักขระเท่ากันหรือไม่ ซึ่งเป็นคุณลักษณะสำคัญของแอนนาแกรม

ค้นหาสระ

งานที่ค่อนข้างง่ายที่มักเกิดขึ้นในการสัมภาษณ์

การผลิต

คุณต้องเขียนฟังก์ชันที่รับสตริงเป็นอาร์กิวเมนต์และส่งกลับจำนวนสระที่มีอยู่ในสตริง
สระคือ "a", "e", "i", "o", "u"

ตัวอย่าง:

findVowels('สวัสดี') // —> 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() ใช้ได้กับทั้งสตริงและอาร์เรย์ ควรใช้เพื่อพิจารณาว่าอาร์เรย์มีค่าบางอย่างหรือไม่ เมธอดนี้จะคืนค่าเป็นจริงหากอาร์เรย์มีค่าที่ระบุ และคืนค่าเป็นเท็จหากไม่มี

มีวิธีแก้ไขปัญหาที่สั้นกว่า:

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

ซึ่งใช้เมธอด .match() ซึ่งช่วยให้คุณสามารถค้นหาได้อย่างมีประสิทธิภาพ หากพบนิพจน์ทั่วไปเป็นอาร์กิวเมนต์ของเมธอดภายในสตริงที่ระบุ ค่าที่ส่งคืนจะเป็นอาร์เรย์ของอักขระที่ตรงกัน หากไม่มีรายการที่ตรงกัน .match() จะส่งคืนค่าว่าง

ฟีโบนักชี

งานคลาสสิกที่สามารถพบได้ในการสัมภาษณ์ในระดับต่างๆ เป็นเรื่องที่ควรค่าแก่การระลึกว่าลำดับฟีโบนัชชีคือชุดของตัวเลข โดยแต่ละลำดับที่ตามมาคือผลรวมของสองตัวก่อนหน้า ดังนั้น ตัวเลขสิบตัวแรกจะมีลักษณะดังนี้: 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 (โดยเฉพาะอย่างยิ่งหากเป็นงานระดับจูเนียร์) แต่ถ้าคุณยังไม่เจอมันอาจมีประโยชน์ในอนาคต - อย่างน้อยก็สำหรับการพัฒนาทั่วไป

Skillbox แนะนำ:

• สมัครเรียนออนไลน์ “นักวิเคราะห์ข้อมูลหลาม”.
• คอร์สออนไลน์ “นักพัฒนาส่วนหน้ามืออาชีพ”.
• หลักสูตรปีปฏิบัติ "นักพัฒนา PHP จาก 0 ถึง PRO".

ที่มา: will.com