4μλΆν° μ€ν°λλ₯Ό μμνλ€. μ€ν°λλ java μΈμ΄λ₯Ό μ¬μ©νμ§λ§ λλ javascriptλ₯Ό μ¬μ©ν΄μ μ°Έμ¬νκ³ μλ€..!π μ€μ μ½λμ λν νΌλλ°±μ λ§μ΄ λ°μ§ λͺ»ν΄μ μμ½μ§λ§ javaμ javascript κ°κ°μ μΈμ΄μ κ°λ°μ² νλ λΉκ΅ν΄λ³Ό μλ μκ³ λ¬΄μλ³΄λ€ μΈμ΄μ κ΅νλμ§ μλ νλ‘κ·Έλλ° κΈ°λ³Έ μμΉλ€, μ½λ μ§λ λ°©λ²μ λν΄μ λ§μ΄ μκ°ν΄λ³Ό μ μλ μ’μ μκ°μ΄ λ κ²μ΄λΌκ³ μκ°νλ€. 맀주 μκ²λ λ΄μ©μ΄λ μ 리ν λ§ ν λ΄μ©μ κΈ°λ‘νλ €νλ€.
#. Series##. Source1. 맀μ§λλ² μμν2. λ³μ λ€μ΄λ° κ·μΉ3. λ³μμ νμ
μ΄λ μλ£κ΅¬μ‘°ν λͺ
μνμ§ μκΈ°4. μ€λ³΅λ κΈ°λ₯ νΌνκΈ°5. κ°κ°μ ν¨μλ μκΈ° κΈ°λ₯λ§ μννκΈ°6. λ°λ³΅λ¬Έ λμ΄μ£ΌκΈ° (break, return)7. νμ
μ€ν¬λ¦½νΈ μ¬μ©νκΈ°8. ν
μ€νΈμ½λ μμ±νκΈ°9. ν
μ€νΈμ½λ μμ±κ·μΉ & ν10. μ°Έκ³ 11. λ§μΉλ©°.
#. Series
μλ¦¬μ¦ νλμ보기[μ κΈ°/νΌμΉκΈ°]
##. Source
κΉνλΈ μμ€[μ κΈ°/νΌμΉκΈ°]
1. 맀μ§λλ² μμν
맀μ§λλ²λ μ€λͺ
μμ΄ λ¬΄μμ λ±μ₯νλ μμλ₯Ό μλ―Ένλ€.
if
κ°μ μ μ΄λ¬Έμ΄λΒ for
κ°μ λ°λ³΅λ¬Έμμ λ§μ΄ λ±μ₯νλ©°, 맀μ§λλ²λ₯Ό μ¬μ©νλ©΄ μ½λλ₯Ό μμ ν λ μΌμΌμ΄ λ€ μμ ν΄μΌνλ€λ λ²κ±°λ‘μ λΏλ§ μλλΌ μ½λλ₯Ό λ³΄κ³ μ΄ν΄νλλ° ν° μ΄λ €μμ μ€λ€. κ·Έλμ μ΄λ¬ν 맀μ§λλ²λΒ const
Β ν€μλλ₯Ό ν΅ν΄ ν¨μ μλ¨μ μμ λ³μμ λ£μ΄μ€ ν, μ¬μ©ν΄μ£Όλ κ²μ΄ μ’λ€.μλΒ μ½λλ μ«μμΌκ΅¬ λλ€μ«μλ₯Ό λ¬Έμμ΄μ λ΄λ ν¨μμΈλ° λ°λ³΅λ¬Έ λ΄λΆμ 맀μ§λλ² 3μ μ¬μ©νλ€.
bad..!
const chooseRandomNumber = () => { const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9] answerNum = '' for (let i = 0; i < 3; i++) { const randomNumber = Math.floor(Math.random() * (9 - i)) const chosenNumber = numbers.splice(randomNumber, 1)[0] const chosen = String(chosenNumber) answerNum += chosen } return answerNum }
BASEBALLNUMBERLENGTH λΌλ λ³μμ 3μ μ΄κΈ°νν΄μ€μΌλ‘μ¨, 맀μ§λλ²λ₯Ό μμ μ£Όμλ€.
good!π
const chooseRandomNumber = () => { const BASEBALL_NUMBER_LENGTH = 3 const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9] answerNum = '' for (let i = 0; i < BASEBALL_NUMBER_LENGTH; i++) { const randomNumber = Math.floor(Math.random() * (9 - i)) const chosenNumber = numbers.splice(randomNumber, 1)[0] const chosen = String(chosenNumber) answerNum += chosen } return answerNum }
2. λ³μ λ€μ΄λ° κ·μΉ
λ¨Όμ μλ°μ€ν¬λ¦½νΈμμλ λ³μλͺ
 첫κΈμμ κΈμ νΉμ _, $λ§ μ¬ μ μλ€. κ·Έ μ΄μΈμ μ«μλ λ€λ₯Έ νΉμλ¬Έμλ μλ¬λ₯Ό μΆλ ₯νλ€.
const 1num; // x const num1 // o const _name; // o const $name; // o
μ§μλ³μλ private λ³μμ κ²½μ°μλΒ
_
λ₯Ό μ¬μ©νλ€.let _privateVariableName let _privateFunctionName
κ·Έλ¦¬κ³ μμ½μ΄λ λ³μλͺ
μΌλ‘ λΆκ°λ₯νλ€. λ§μ°¬κ°μ§λ‘ μλ¬λ₯Ό μΆλ ₯νλ€.Β MDN μμ½μ΄ λͺ¨μ
const true; // x const case; // x const break; // x // ...
κ·Έλ¦¬κ³ λ³μλͺ
μ μΌλ°μ μΌλ‘Β μΉ΄λ©μΌμ΄μ€μΒ μ€λ€μ΄ν¬μΌμ΄μ€λ₯Ό νΌμ©ν΄μ μμ±νλ€.
μΉ΄λ©μΌμ΄μ€
λ μ¬λ¬ λ¨μ΄κ° λ€μ΄κ°λ λ³μλͺ
μΌ κ²½μ°, 첫λ¨μ΄μ 첫κΈμλ μλ¬Έμλ‘, λλ²μ§ΈλΆν°μ 첫κΈμλ λλ¬Έμλ‘ μμ±νλ νκΈ°λ²μ΄λ€.let myname = 'taeeun' // bad let myName = 'taeeun' // good
μ€λ€μ΄ν¬μΌμ΄μ€
λ μ¬λ¬ λ¨μ΄κ° λ€μ΄κ°λ λ³μλͺ
μΌ κ²½μ°, _λ₯Ό ν΅ν΄ λμ΄μ νκΈ°νλ λ°©λ²μ΄λ€.const MAXLENGTH = 10 // bad const MAX_LENGTH = 10 // good
λ³΄ν΅ μμμ μ€λ€μ΄ν¬μΌμ΄μ€λ₯Ό, μΌλ°μ μΈ λ³μμλ μΉ΄λ©μΌμ΄μ€λ₯Ό μ¬μ©νλ κ² κ°λ€.
3. λ³μμ νμ μ΄λ μλ£κ΅¬μ‘°ν λͺ μνμ§ μκΈ°
λ³μλ₯Ό λ€μ΄λ°ν λλ κ΅³μ΄ νμ
μ΄λΒ μλ£κ΅¬μ‘°νμ λͺ
μνμ§ μλ κ²μ΄ μ’λ€.
κ·Έ μ΄μ λ ν΄λΉ λ³μμ νμ
μ΄λ μλ£κ΅¬μ‘°νμ λ°κΏ κ²½μ°, λͺ¨λ λ³μμ΄λ¦μ λ°κΏμ€μΌ νκΈ° λλ¬Έμ΄λ€. λ³μ λ€μ΄λ°μ κ·Έ λ³μμ νμ보λ€λ ν λΉλ κ°μ μλ―Έλ₯Ό λλ¬λ΄λ κ²μ΄ μ’λ€.
ν¨μμ κ²½μ°
// bad const compareTwoArray = (numbers1, numbers2) => {} // good! const compareNumbers = (numbers1, numbers2) => {}
λ°°μ΄μ κ²½μ°
const numberArr = [1, 2, 3, 4] const numbers = [1, 2, 3, 4]
4. μ€λ³΅λ κΈ°λ₯ νΌνκΈ°
μ€λ³΅λ κΈ°λ₯μ μ΅λν νΌνκ³ κ°λ₯ν μ£Όμ΄μ§ fieldλ₯Ό μ¬μ©νλ€.
ν΄λΉΒ μ½λλ μλμ°¨λ₯Ό μμ±νκ³ μ¬μ©μκ° μ
λ ₯ν μ«μλ§νΌ λλ€μΌλ‘ κ°κ°μ μλμ°¨λ₯Ό μ΄λμμΌ κ°μ₯ λ©λ¦¬κ° μλμ°¨λ₯Ό μΆλ ₯νλ νλ‘κ·Έλ¨μ΄λ©°,
μ²μ μ½λλ₯Ό μμ±ν λ, λλ κΈ°μ‘΄μ μλμ°¨ κ°μ²΄ car λ΄λΆ position κ°μ΄ μμΌλ©΄μλ μλμ°¨μ μ΄λν 거리λ₯Ό μ μμ carDistances λ°°μ΄μ λ°λ‘ μ μ₯νμλ€.
bad..!
class Car { name position = 0 constructor(name) { this.name = name } go() { this.position = this.position + 1 } } const carDistances = [] // κ°κ°μ μλμ°¨ μ΄λ거리 moveCar(car, carNames, carDistances) // μλμ°¨λ₯Ό μ΄λμν€κ³ carDistances κ° λ³κ²½ // getWinner ν¨μμμλ λΆνμνκ² carDistances λ°°μ΄μ λ°μμΌνλ€. const getWinner = (carNames, carDistances) => { const max = Math.max(...carDistances) let winner = '' for (let i = 0; i < carNames.length; i++) { if (max === carDistances[i]) winner += `${carNames[i]},`} return winner }
νμ§λ§ λ°°μ΄ λμ car.position μ μ¬μ©νλ©΄ μ½λλ κΉλν΄μ§κ³ λΆνμν λ©λͺ¨λ¦¬ λλΉλ₯Ό λ§μ μ μλ€.
good π
moveCar(car) // moceCar ν¨μλ carκ°μ²΄μ positionλ§ μ¬λ €μ£Όλ μν λ§ μν! // getWinner ν¨μλ carκ°μ²΄λ€μ΄ λ€μ΄μλ cars λ°°μ΄λ§ λ°κ³ position λΉκ΅λ§ ν΄μ£Όλ μν λ§ μν! const getWinner = cars => { let max = 0 cars.map(car => { if (car.position > max) max = car.position }) let winner = [] cars.map(car => { if (max === car.position) winner.push(car.name) }) return winner.join() }
μΈλ°μλ μ€λ³΅μ κΌ νΌνκ³ κ°κ°μ ν¨μλ μ λ§Β μκΈ°μ κΈ°λ₯λ§ μνν μ μλλ‘Β μ§λ κ²μ΄ μ’λ€.
5. κ°κ°μ ν¨μλ μκΈ° κΈ°λ₯λ§ μννκΈ°
μ€ν°λ λ―Έμ
νλ‘κ·Έλλ° μꡬμ¬νμμλ νμ μ΄λ¬ν μ‘°κ±΄μ΄ λ€μ΄μμλ€.
μ΄λ ν¨μλ₯Ό μ΅λν μκΈ° κΈ°λ₯λ§ μνν μ μλλ‘ μͺΌκ°λ κ²μ μꡬνλ€. ν¨μλ₯Ό μͺΌκ°λ―λ‘μ, κ°λ
μ±κ³Ό μ μ§λ³΄μκ° μ’μμ§λ©°, μμ μ±μ μ¬λΌκ°λ€.
OO makes code understandable by encapsulating moving parts. FP makes code understandable by minimizing moving parts. -Michael Feathers
κ°μ²΄μ§ν₯μ λμνλ λΆλΆμ μΊ‘μνν΄μ μ΄ν΄ν μ μκ² νκ³ , ν¨μν νλ‘κ·Έλλ°μ λμνλ λΆλΆμ μ΅μνν΄μ μ½λ μ΄ν΄λ₯Ό λλλ€. - λ§μ΄ν΄ νλμ€
μλ°μ€ν¬λ¦½νΈλ λ€λ₯Έ κ°μ²΄μ§ν₯ νλ‘κ·Έλλ° μΈμ΄λ€μ λΉν΄ λ μ μ°ν νΉμ§μ κ°μ§μ§λ§ κ°μ²΄μ§ν₯ νλ‘κ·Έλλ°μ μ§μνλ©°, λν ν¨μν νλ‘κ·Έλλ°λ μ§μνλ€. μ¬κΈ°μΒ μ§μνλ€λ μλ―Έλ μλ²½ν μΈμ΄μ νΉμ±μ μλμ§λ§ λΉμ·νκ² κ΅¬νμ κ°λ₯νλ€λ λ§μ΄λ€. μλ²½νκ² κ°μ²΄μ§ν₯μ μΌλ‘ μ½λλ₯Ό μμ±νκ³ λͺ¨λ ν¨μλ₯Ό ν¨μν νλ‘κ·Έλλ°μΌλ‘ μμ±νλ κ²μ μ΄λ ΅κ² μ§λ§ μ§ν₯μ μ μ νμ
νκ³ μ΅λνΒ μ’μ μ½λλ₯Ό μμ±νκ³ μ νλ κ²μ΄ μ€μνμ§ μμκΉ? μκ°ν΄λ³΄μλ€.
6. λ°λ³΅λ¬Έ λμ΄μ£ΌκΈ° (break, return)
λ€μ ν¨μλ μ¬μ©μκ° μ
λ ₯ν μλμ°¨μ΄λ¦μ΄ 5κΈμ μ΄κ³ΌμΈμ§ κ²μ¬νλΒ ν¨μμ΄λ€.
ν΄λΉ ν¨μλ μ
λ ₯ν κ°μ κΈΈμ΄λ§νΌ λ°λ³΅λ¬Έμ λλ©΄μ 쑰건μ λ§μ‘±νλ©΄ errorCheck λ³μλ₯Ό λ°κΎΈλλ‘ μ§μ μ€κ°μ μ‘°κ±΄μ΄ λ§μ‘±νμ¬λ λΆνμνκ² λͺ¨λ λ°λ³΅λ¬Έμ μννλ€.
badβ¦!
const checkCarsNameLength = carNames => { const MAX_CARNAME_LENGTH = 5 let errorCheck = true for (let i = 0; i < carNames.length; i++) { if (carNames[i].length > MAX_CARNAME_LENGTH) errorCheck = false } // μ΄λ¦μ΄ 5μ΄κ³ΌμΈ κ²μ΄ μμΌλ©΄ falseλ₯Ό, μμΌλ©΄ trueλ₯Ό 리ν΄. return errorCheck }
νμ§λ§ 쑰건μ λ§μ‘±νμ λ λ°λ‘ κ°μ return νλλ‘ λ°κΏ¨λλ λ³μλ₯Ό μ°μ§μμλ λκ³ , 쑰건 λ§μ‘±μ, λ°λ³΅λ¬Έλ μ λΆ νμνμ§ μμλ λμλ€.
good!!π
const checkCarsNameLength = carNames => { const MAX_CARNAME_LENGTH = 5 for (let i = 0; i < carNames.length; i++) { if (carNames[i].length > MAX_CARNAME_LENGTH) return false } return true }
μ΄λ κ² λΆνμν λ³μλ₯Ό μ€μ΄κ³ ,Β returnΒ κ³ΌΒ breakΒ λ‘ κ°λ₯νλ©΄ λ°λ³΅λ¬Έμ λΉ λ₯΄κ² λΉ μ Έλμ¬ μ μλλ‘ μ§λ κ²μ΄ μ’λ€.
7. νμ μ€ν¬λ¦½νΈ μ¬μ©νκΈ°
java μ€ν°λμ¬μ μ£Όμ΄μ§ λ―Έμ
μ κ°μ²΄μ§ν₯μ μΈΒ
class Type
μ μ£Όλ‘ μ¬μ©νλ€. μλ°μ€ν¬λ¦½νΈμλ class λ¬Έλ²μ΄ μμ΄μ μ½λ©μ κ°λ₯νμ§λ§, νμ
μ΄ μ§μ λμ΄μμ§ μμμ μ½λλ₯Ό μ§λ©΄μ νμ¬ λ³μκ° μ΄λ€ νμ
μΈμ§κ° λ§€μ° ν·κ°λ Έλ€.Carκ°μ²΄ λ°°μ΄μ μΈμλ‘ λ°λΒ ν¨μμ κ²½μ°
// javascript : λ°°μ΄μΈλ°, λ΄λΆ μμλ€μ νμ μ΄ λΆλͺ νν¨ makeCars(cars, carNames) // typescript : λ°°μ΄ λ΄λΆ νμ λͺ μλ‘ μλ¬λ°©μ§ + ν·κ°λ¦Όλ°©μ§! makeCars(cars: Car[], carNames: string[])
λ€μΒ μ½λλ λ‘λλ₯Ό ꡬ맀νκ³ λΉμ²¨λ‘λμ λΉκ΅νλ νλ‘κ·Έλ¨μ΄λ©°, λ‘λ νμ₯μ μλ―ΈνλΒ
Lotto
Β νμ
κ³Ό μ€μ λΉμ²¨λ‘λλ₯Ό μλ―ΈνλΒ WinningLotto
Β νμ
μ΄ λ°λ‘ μ μλμ΄μμ΄ λμ± ν·κ°λ Έλ€./** * λ‘λ νμ₯μ μλ―Ένλ κ°μ²΄ */ class Lotto { numbers = [] constructor(numbers) { this.numbers = numbers } } /** * λΉμ²¨ λ²νΈλ₯Ό λ΄λΉνλ κ°μ²΄ */ class WinningLotto { lotto = null bonusNo = 0 constructor(lotto, bonusNo) { this.lotto = lotto this.bonusNo = bonusNo } match(userLotto) { let count = 0 let bonusCount = 0 this.lotto.numbers.map(number => { userLotto.numbers.indexOf(number) >= 0 && count++ }) userLotto.numbers.indexOf(this.bonusNo) >= 0 && bonusCount++ if (count === 6) return 'FIRST' if (count === 5 && bonusCount) return 'SECOND' if (count + bonusCount === 5) return 'THIRD' if (count + bonusCount === 4) return 'FOURTH' if (count + bonusCount === 3) return 'FIFTH' return 'MISS' } } // javascript : ν¨μμ μΈμλ‘ λ€μ΄κ°λ λ³μλͺ λ€μ΄ λ§€μ° ν·κ°λ¦Ό!! matchLottos(myLottos, winningLotto) // typescript : λ΄λΆ νμ λͺ μλ‘ μλ¬λ°©μ§ + ν·κ°λ¦Όλ°©μ§! matchLottos(myLottos: Lotto[], winningLotto: WinningLotto): void
μμ§ νμ
μ€ν¬λ¦½νΈλ μ΅μμΉ μμ§λ§, μ΄ κΈ°νμ κ°μ΄ νμ΅νλ©΄ μ’μ κ² κ°λ€.
8. ν μ€νΈμ½λ μμ±νκΈ°
2020λ
4μ 18μΌ, μ μ€ μ€νλΌμΈ μ€ν°λμμΒ
ν
μ€νΈ
Β μ λν΄μ λ°°μ λ€.μ€ν°λμμλ java ν
μ€ν
νλ μμν¬ JUnit λ₯Ό μ¬μ©νλλ°, λλ μλ°μ€ν¬λ¦½νΈμ΄κΈ° λλ¬Έμ jestλΌλ νλ μμν¬λ₯Ό μ νν΄μ νλ² ν
μ€νΈ ν΄λ³΄μλ€.
μ¬μ©λ°©μμ λΉμ·νλ€.
λ¨Όμ jest νλ μμν¬λ₯Ό μ€μΉνκ³ ,
npm i -D jest
package.json
Β νμΌμ scriptμ jest λͺ
λ Ήμ΄λ₯Ό μΆκ°μμΌμ£Όλ©΄ λλ€. μ€νμ :Β npm run test
"scripts": { "test": "jest" }
κ·Έλ¦¬κ³ test λλ ν 리λ₯Ό λ§λ€μ΄ ν΄λΉ ν
μ€ν
νμΌ.js μ μμ±ν΄μ£Όλ©΄ λμλ€.
// calculatorTest.js class Calculator { add(i, j) { return i + j } subtract(i, j) { return i - j } multiple(i, j) { return i * j } divide(i, j) { return i / j } } test('λ§μ ', () => { let calculator = new Calculator() expect(calculator.add(1, 2)).toBe(3) }) test('λΊμ ', () => { let calculator = new Calculator() expect(calculator.subtract(1, 2)).toBe(-1) }) test('κ³±μ ', () => { let calculator = new Calculator() expect(calculator.multiple(1, 2)).toBe(2) }) test('λλμ ', () => { let calculator = new Calculator() expect(calculator.divide(2, 1)).toBe(2) })
jest APIμ testλΌλ λ©μλλ₯Ό μ¬μ©νλλ°, jest API λ©μλλ λ€μνκ² μλ κ² κ°λ€. μκ°λ λΒ jest 곡μλ¬Έμλ₯Ό νλ² μ λ³Ό κ².
test("ν
μ€νΈ μ΄λ¦", function, timeout)
9. ν μ€νΈμ½λ μμ±κ·μΉ & ν
1οΈβ£ ν
μ€νΈ μ΄λ¦μΒ νκΈλ‘ μμ±νλ κ²μ΄ μ’λ€. μμ ν
μ€νΈλ λ§€μ° κ°λ¨νμ§λ§ νλ‘κ·Έλ¨μ΄ 볡μ‘ν΄μ§λ©΄ ν
μ€νΈλͺ
λ κΈΈμ΄μ§ κ²μ΄κ³ κ°κ° ν
μ€νΈλ§λ€ μ΄ν΄νκΈ° μ½κ³ μλ―Έλ₯Ό μ μ λ¬ν΄μ£Όμ΄μΌ νκΈ° λλ¬Έμ΄λ€.
2οΈβ£ ν
μ€νΈλ κ°μ₯ μμ λ¨μμ κΈ°λ₯λΆν° ν
μ€νΈνλ€. μλ₯Όλ€μ΄, A,Bκ° CλΌλ κΈ°λ₯μ μμ‘΄λ κ²½μ°, A,Bλ₯Ό ν
μ€νΈνκ³ κ²μ¦μ΄ μλ£λλ©΄ Cμμ A,Bκ° ν¬ν¨λμ§ μμ κΈ°λ₯λ§ ν
μ€νΈνλ©΄ λλ€.
3οΈβ£ νλμ ν
μ€νΈλ λ
립μ μ΄μ΄μΌ νλ€. ν
μ€νΈλΌλ¦¬ μμ‘΄ν΄μλ μλλ€.
10. μ°Έκ³
11. λ§μΉλ©°.
μ’μ κΈ°νκ° μμ΄μ OOP μ€ν°λλ₯Ό νκ² λμλ€. λΉλ‘ java μ€ν°λμ§λ§ μ€ν°λλ₯Ό νλ©΄μ λ§μ κ²λ€μ λ°°μ°λ κ² κ°λ€. νμμ κΈ°λ₯ꡬν μμ£Όμ 곡λΆλ₯Ό νλ€λ©΄ μ΄λ² μ€ν°λλ₯Ό ν΅ν΄μλΒ μ½λλ₯Ό μμ±νλ λ°©λ²μ λν΄μ λ§μ΄ μκ°ν΄λ³Ό μ μμ΄μ μ’μλ€. νμ¬λ ν
μ€νΈ μ½λ μμ±μ κ΄ν λ―Έμ
μ μ§ν μ€μ μλλ° μμΌλ‘ λ μ΄μ¬ν μν΄μΌκ² λ€!!
Loading Comments...