๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
Book TIL

๋…ธ๋งˆ๋“œ์ฝ”๋” ๋ถํด๋Ÿฝ ์žกํ•™์‚ฌ์ „ Day12 - ๋น„๋ฐ€๋ฒˆํ˜ธ ์ €์žฅ๋ฐฉ๋ฒ• | ํ•จ์ˆ˜ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ

by vividmin 2023. 1. 25.
320x100

๋…ธ๋งˆ๋“œ์ฝ”๋” ๋ถํด๋Ÿฝ ์žกํ•™์‚ฌ์ „ Day12

 

 

๐Ÿ“š ๋ฒ”์œ„ :  Ep35. ๋น„๋ฐ€๋ฒˆํ˜ธ ์ €์žฅ๋ฐฉ๋ฒ• - Ep38. ํ•จ์ˆ˜ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ

 

 

 

๐Ÿ““ ์ฑ…์—์„œ ๊ธฐ์–ตํ•˜๊ณ  ์‹ถ์€ ๋‚ด์šฉ์„ ์จ๋ณด์„ธ์š”.


1. ์šฐ๋ฆฌ๊ฐ€ ๋งค์ผ ์“ฐ๋Š” ๋น„๋ฐ€๋ฒˆํ˜ธ ์–ด๋–ป๊ฒŒ DB์— ์ €์žฅ๋˜์–ด ์žˆ์„๊นŒ?

  • ์•„์ด๋”” : ๋น„๋ฐ€๋ฒˆํ˜ธ ๊ทธ๋Œ€๋กœ ์ €์žฅ โŒ
    • (๋งค์šฐ ๋‚˜์œ ๋ฐฉ๋ฒ•, ์œ ์ถœ ์œ„ํ—˜ ๋งค์šฐ ํผ)
  • DB์•”ํ˜ธํ™”ํ•˜๊ณ  ํšŒ์‚ฌ์—์„œ ์ฃผ๋Š” key๋กœ ๋กœ๊ทธ์ธํ•ด์„œ ์‚ฌ์šฉ ๐Ÿ”บ
    •  (์ฒซ ๋ฒˆ์งธ๋ณด๋‹ค๋Š” ์ข‹์€ ๋ฐฉ๋ฒ•, but key ์œ ์ถœ ์‹œ ์œ„ํ—˜ํ•œ ๊ฒƒ์€ ๋งˆ์ฐฌ๊ฐ€์ง€)
  • ํ•ด์‹œ ํ•จ์ˆ˜ ์‚ฌ์šฉ โญ•
    • ๋‚ด๊ฐ€ ์ž…๋ ฅํ•œ ๊ฐ’์„ ๋ฌด์ž‘์œ„๋กœ ๊ฐ’์œผ๋กœ ๋ณ€ํ™˜ํ•ด ์คŒ
    • ํ•ด์‹œํ•จ์ˆ˜๋Š” ์–ด๋–ป๊ฒŒ ๋™์ž‘ํ• ๊นŒ?
      • ๋™์ผํ•œ ์ž…๋ ฅ๊ฐ’ = ๋™์ผํ•œ ์ถœ๋ ฅ๊ฐ’
      • ์ž…๋ ฅ๊ฐ’ ์‚ด์ง ๋ฐ”๋€œ ๐Ÿ‘‰ ์ถœ๋ ฅ๊ฐ’ ์ „ํ˜€ ๋‹ค๋ฅด๊ฒŒ ๋ฐ”๋€œ (๋ฌด์ž‘์œ„์„ฑ)
      • ํ•ด์‹œํ•จ์ˆ˜ ๋ณ€ํ™˜๋œ ๊ฐ’ ์ž…๋ ฅ ๐Ÿ‘‰ ์›๋ž˜ ๊ฐ’ ์•ˆ ๋‚˜์˜ด
      • But! ๋ ˆ์ธ๋ณด์šฐ ํ…Œ์ด๋ธ”(ํ•ด์‹œํ•จ์ˆ˜๊ฐ€ ๋ณ€๊ฒฝํ•œ ๊ฐ’์„ ์›๋ž˜๊ฐ’๊ณผ ์—ฐ๊ฒฐํ•œ ํ‘œ)์ด ์žˆ๋‹ค๋ฉด ์›๋ž˜๊ฐ’์„ ์•Œ ์ˆ˜ ์žˆ์Œ
  • ์†”ํŠธ(Salt) ๐Ÿ‘
    • ๊ฐ€์žฅ ๊ฐ•๋ ฅํ•œ ๋ฐฉ๋ฒ•
    • ๋‚ด๊ฐ€ ์ž…๋ ฅํ•œ ๊ฐ’ + salt(๋ฌด์ž‘์œ„ ํ…์ŠคํŠธ) ํ•ด์‹œํ•จ์ˆ˜ ํ†ต๊ณผ ๐Ÿ‘‰ ๋ฌด์ž‘์œ„ ๊ฐ’ ๋‚˜์˜จ๋‹ค.
    • ๋ ˆ์ธ๋ณด์šฐํ…Œ์ด๋ธ”๋กœ๋„ ์ฐพ์„ ์ˆ˜ ์—†๋‹ค.

 

2. ํ”„๋กœ๊ทธ๋ž˜๋ฐ ํŒจ๋Ÿฌ๋‹ค์ž„

  • ํ”„๋กœ๊ทธ๋ž˜๋ฐ์„ ํ•˜๋Š” ์‚ฌ๊ณ ์˜ ํ‹€, ํ”„๋กœ๊ทธ๋ž˜๋จธ๊ฐ€ ํ”„๋กœ๊ทธ๋ž˜๋ฐ์„ ํ•  ๋•Œ์˜ ๊ด€์ , ๋ฐฉ์‹๋“ฑ์„ ๋งํ•œ๋‹ค.
  • ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด๋Š” ํ”„๋กœ๊ทธ๋ž˜๋ฐ ํŒจ๋Ÿฌ๋‹ค์ž„์„ ํ•˜๋‚˜ ๋˜๋Š” ํ•˜๋‚˜์ด์ƒ ์ง€์›ํ•œ๋‹ค.

 

3. ๊ฐ์ฒด์ง€ํ–ฅ ํ”„๋กœ๊ทธ๋ž˜๋ฐ - Class

  • ์—ฌ๋Ÿฌ ์บ๋ฆญํ„ฐ๊ฐ€ ๋‚˜์˜ค๋Š” ๊ฒŒ์ž„์„ ๋งŒ๋“ ๋‹ค๊ณ  ์ƒ๊ฐํ•ด ๋ณด์ž.
  • ๊ธฐ๋ณธ์ ์œผ๋กœ ์บ๋ฆญํ„ฐ์˜ ์ด๋ฆ„, ์ฒด๋ ฅ, ์Šคํ‚ฌ๋“ฑ์ด ํ•„์š”ํ•˜๋‹ค. ๊ทธ๋Ÿฐ๋ฐ ์บ๋ฆญํ„ฐ๋Š” ํ•œ ๋ช…์ด ์•„๋‹ˆ๋‹ค ๋งŒ์•ฝ ํ•œ ๋ช… ํ•œ ๋ช… ๋‹ค ์ž‘์„ฑํ•ด์•ผ ํ•œ๋‹ค๋ฉด?
const player1 = {
  name: 'John',
  health: 86,
  skill : "magician"
}
const player2 = {
  name: 'May',
  health: 75,
  skill : "archer"
}
const player3 = {
  name: 'Jack',
  health: 99,
  skill : "hunter"
}

// ๐Ÿ™…‍โ™€๏ธ ๋„ˆ๋ฌด ๋น„ํšจ์œจ์ ์ด๋‹ค.
  • ์บ๋ฆญํ„ฐ๋“ค์€ ๊ธฐ๋ณธ์ ์œผ๋กœ ๊ฐ™์€ ์†์„ฑ์„ ๊ฐ€์กŒ๋‹ค. (name, health, skill)
    • ์ด ๊ตฌ์กฐ ์œ ์ง€ ์‹œ ์ƒ๊ธธ ์ˆ˜ ์žˆ๋Š” ๋ฌธ์ œ? ๐Ÿ‘‰ ์˜คํƒ€ ๋ฐœ์ƒ ๊ฐ€๋Šฅ, ์ถ”๊ฐ€ ์†์„ฑ ๋„ฃ๊ธฐ ์–ด๋ ค์›€(์—„์ฒญ๋‚œ ๋ฐ˜๋ณต์ž‘์—… ํ•„์š”ํ•จ)
    • ๋”ฐ๋ผ์„œ ์ด๋ฅผ ํ•ด๊ฒฐํ•˜๊ธฐ ์œ„ํ•ด Class ๊ตฌ์กฐ๋ฅผ ์ด์šฉํ•œ๋‹ค. (์ผ์ข…์˜ ๋ชจ์–‘ ์ฐ์–ด๋‚ด๋Š” ๊ณต์žฅ)
class Player {
  constructor(name, health, skill) {
    this.name = name;
    this.health = health;
    this.skill = skill;
    this.xp = 0;	// xp๋Š” ๊ธฐ๋ณธ๊ฐ’ 0
  }
}
  • new Player (name, health, skill) ์ด์šฉํ•ด์„œ ์บ๋ฆญํ„ฐ๋ฅผ ๊ฐ„ํŽธํ•˜๊ฒŒ ์—ฌ๋Ÿฌ ๊ฐœ ๋งŒ๋“ค ์ˆ˜ ์žˆ๋‹ค.

 

4. ๊ฐ์ฒด์ง€ํ–ฅ ํ”„๋กœ๊ทธ๋ž˜๋ฐ - ์ƒ์†

  • ์žฌ์‚ฐ์„ ๋ฌผ๋ ค์ฃผ๋Š” ๊ฒƒ์ฒ˜๋Ÿผ ํŠน์ง•์„ ๋ฌผ๋ ค์ฃผ๊ณ  ๋ฌผ๋ ค๋ฐ›๋Š”๋‹ค.
class Human {
  constructor(name) {
    this.name = name;
    this.arms = 2;
    this.legs = 2;
  }
}

//  ์—ฐ๋ น๋Œ€๊ฐ€ ๋‹ค์–‘ํ•œ class๊ฐ€ Human์˜ ํŠน์ง•์„ ๊ณตํ†ต์ ์œผ๋กœ ๊ฐ€์ง€๊ณ  ์žˆ๋‹ค๋ฉด?

class Teenager extends Human {
  constructor(name) {
    this.emotional = true;
  }
  curse() {
    return '๐Ÿคฌ';
  }
}

class Baby extends Human {
  constructor(name) {
    this.lovely = true;
  }
  cry() {
    return '๐Ÿ˜ซ';
  }
}
  • ์ด๋ ‡๊ฒŒ ์ƒ์†์„ ํ†ตํ•ด ์ค‘๋ณต์„ ํ•ด๊ฒฐํ•˜๋ฉด ๊ณตํ†ต ํด๋ž˜์Šค์˜ ๊ธฐ๋ณธ ์†์„ฑ์€ ๊ทธ๋Œ€๋กœ ๊ฐ€์ ธ์˜ค๋ฉด์„œ ์ž์‹ ๋งŒ์˜ ์†์„ฑ๋„ ์ถ”๊ฐ€ํ•  ์ˆ˜ ์žˆ๋‹ค!

 

5. ํ•จ์ˆ˜ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ

  • ๊ฐœ๋ฐœ์ž๋ผ๋ฉด ๋ฐ˜๋“œ์‹œ ๋ฐฐ์›Œ์•ผ ํ•œ๋‹ค๊ณ  ์ƒ๊ฐํ•จ
  • ๋ฒ„๊ทธ๊ฐ€ ๋ฐœ์ƒํ•˜๊ธฐ ์–ด๋ ค์šด ๊ตฌ์กฐ๋ผ์„œ ๊ฐœ๋ฐœ์ž์—๊ฒŒ ๋งค์šฐ ์œ ์šฉํ•˜๋‹ค!
  • ์ด๋ฅผ ์ดํ•ดํ•˜๋ ค๋ฉด ํ”„๋กœ๊ทธ๋ž˜๋ฐ ํŒจ๋Ÿฌ๋‹ค์ž„์˜ ํฐ ๊ฐˆ๋ž˜์ธ ์„ ์–ธํ˜• / ๋ช…๋ นํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ์„ ๋จผ์ € ์•Œ์•„์•ผ ํ•œ๋‹ค.
  ์„ ์–ธํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๋ช…๋ นํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ
์˜ˆ์‹œ (์ƒŒ๋“œ์œ„์น˜ ๋งŒ๋“ค๊ธฐ) BLT ์ƒŒ๋“œ์œ„์น˜ ๋งŒ๋“ค์–ด์ค˜ 1. ๋นต์„ ๊บผ๋‚ด์„œ ๋‘ ์žฅ ๊ตฌ์›Œ๋ผ
2. ์–‘์ƒ์ถ” ์„ธ์žฅ ์”ป๊ณ , ํ† ๋งˆํ†  ์ฐ์–ด์„œ
์„ธ ์กฐ๊ฐ ์ค€๋น„ํ•˜๊ณ , ๋ฒ ์ด์ปจ ๊ตฌ์›Œ์„œ ์„ธ๊ฐœ ์ค€๋น„ํ•ด๋ผ
3. 1๋ฒˆ์˜ ๋นต  ํ•œ ๊ฐœ ์œ„์— 2๋ฒˆ ์žฌ๋ฃŒ๋ฅผ ์Œ“์•„์„œ ๋‚˜๋จธ์ง€ ๋นต  ํ•œ ๊ฐœ๋กœ ๋ฎ์–ด๋ผ
ํŠน์ง• ์›ํ•˜๋Š” ๊ฒฐ๊ณผ๊ฐ’ ์„ ์–ธ ์›ํ•˜๋Š” ๊ฒฐ๊ณผ๊ฐ’์— ์–ด๋–ป๊ฒŒ ๋„๋‹ฌํ•˜๋Š”์ง€ ์„ ์–ธ
๊ฒฐ๊ณผ์ค‘์‹ฌ = ์‹ค์ˆ˜๊ฐ€ ์ ์Œ ์„ธ์„ธํ•˜๊ฒŒ ์ง€์‹œ = ์‹ค์ˆ˜ํ•˜๊ธฐ ์‰ฌ์›€
๋™๋ฃŒ๊ฐ€ ์ฝ”๋“œ๋ฅผ ์ดํ•ดํ•˜๊ธฐ ์‰ฌ์›€ ๋™๋ฃŒ๊ฐ€ ์ฝ”๋“œ๋ฅผ ์ดํ•ดํ•˜๊ธฐ ์–ด๋ ค์›€
  • ์ฝ”๋“œ ์˜ˆ์‹œ (๊ณต๋ฐฑ ๐Ÿ’œ๋กœ ๋ฐ”๊พธ๊ธฐ)
// ์„ ์–ธํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ

function spaceToHeart(text) {
  return text.replace(' ', '๐Ÿ’œ');
}

// ๋ช…๋ นํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ

function spaceToHeart(text) {
  let result = '';
  for (let i = 0; i < text.length; i++) {
    if (text[i] === ' ') {
      result += '๐Ÿ’œ';
    } else {
      result += text[i];
    }
  }
  return result;
}
  • ํ•จ์ˆ˜์˜ ์ธ์ž๋กœ ํ•จ์ˆ˜๋ฅผ ๋ณด๋‚ผ ์ˆ˜ ์žˆ์Œ
  • ํ•จ์ˆ˜ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ ๐Ÿ‘‰ ์„ ์–ธํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์ปจ์…‰์„ ์œ ์ง€ํ•จ
function checkForOdd(item) {
  return item % 2 === 0;
}

function removeOdd(items) {
  return items.filter(checkForOdd);
}

 

 

 

 

 

โœ๐Ÿป ์˜ค๋Š˜ ์ฝ์€ ์†Œ๊ฐ์€? ๋– ์˜ค๋ฅด๋Š” ์ƒ๊ฐ์„ ๊ฐ€๋ณ๊ฒŒ ์ ์–ด๋ณด์„ธ์š”.


๋น„๋ฐ€๋ฒˆํ˜ธ๊ฐ€ ์ €์žฅ๋˜๋Š” ๊ฒƒ์— ๋Œ€ํ•ด์„œ ๋‹น์—ฐํ•˜๊ฒŒ๋งŒ ์ƒ๊ฐํ–ˆ๋Š”๋ฐ ์ƒ๊ฐ๋ณด๋‹ค ๋‹ค์–‘ํ•œ ๋ฐฉ๋ฒ•์œผ๋กœ ๋น„๋ฐ€๋ฒˆํ˜ธ๊ฐ€ ์ €์žฅ๋œ๋‹ค๋Š” ์‚ฌ์‹ค์„ ์•Œ๊ฒŒ ๋˜์—ˆ๋‹ค. ํŠนํžˆ ์–ด์ œ ๋ฐฐ์› ๋˜ ํ•ด์‹œํ…Œ์ด๋ธ”์˜ ํ•ด์‹œ ํ•จ์ˆ˜๊ฐ€ ์—ฌ๊ธฐ์— ์“ฐ์ธ๋‹ค๋Š” ์‚ฌ์‹ค์ด ์‹ ๊ธฐํ–ˆ๋‹ค.

๊ทธ๋ฆฌ๊ณ  ๊ฐ์ฒด์ง€ํ–ฅ๊ณผ ํ•จ์ˆ˜ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ์— ๋Œ€ํ•ด์„œ๋„ ์ข€ ๋” ์ •ํ™•ํžˆ ๊ฐœ๋…์ •๋ฆฌ๋ฅผ ํ•  ์ˆ˜ ์žˆ์—ˆ๋‹ค. ํŠนํžˆ ํ•จ์ˆ˜ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ์˜ ์žฅ์  ์ค‘ ๋ฒ„๊ทธ๊ฐ€ ๋ฐœ์ƒํ•˜๊ธฐ ์–ด๋ ต๋‹ค๋Š” ์‚ฌ์‹ค์„ ์ƒˆ๋กญ๊ฒŒ ์•Œ๊ฒŒ ๋˜์—ˆ๋‹ค. ์ •ํ™•ํžˆ ์–ด๋–ค ์›๋ฆฌ๋กœ ๋ฒ„๊ทธ๊ฐ€ ๋ฐœ์ƒํ•˜๊ธฐ ์–ด๋ ค์šด ๊ฒƒ์ธ์ง€ ๊ถ๊ธˆํ•˜๋‹ค.

 

 

๐Ÿ‘€ ๊ถ๊ธˆํ•œ ๋‚ด์šฉ์ด ์žˆ๊ฑฐ๋‚˜, ์ž˜ ์ดํ•ด๋˜์ง€ ์•Š๋Š” ๋‚ด์šฉ์ด ์žˆ๋‹ค๋ฉด ์ ์–ด๋ณด์„ธ์š”.


  • ๋Œ€๋ถ€๋ถ„์˜ ์ธํ„ฐ๋„ท ์‚ฌ์ดํŠธ์—์„œ๋Š” ์–ด๋–ค ๋น„๋ฐ€๋ฒˆํ˜ธ ์ €์žฅ๋ฐฉ์‹์„ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ๋Š”์ง€ ๊ถ๊ธˆํ•˜๋‹ค.
  • ํ•จ์ˆ˜ํ˜• ํ”„๋กœ๊ทธ๋ž˜๋ฐ์ด ๋ฒ„๊ทธ๊ฐ€ ๋ฐœ์ƒํ•˜๊ธฐ ์–ด๋ ค์šด ์ด์œ ?
๋ฐ˜์‘ํ˜•

๋Œ“๊ธ€