yceffort

yceffort

frontend engineer

yceffort Β© All rights reserved.

javascript

javascript

Javascript - Promise

## Promise ```javascript new Promise(executor) ``` `executor`λŠ” `resolve`및 `reject` 인수λ₯Ό 전달할 μ‹€ν–‰ν•¨μˆ˜λ₯Ό μ˜λ―Έν•œλ‹€. μ‹€ν–‰ν•¨μˆ˜λŠ” `resolve`와 `reject`λ₯Ό λ°›μ•„ μ¦‰μ‹œ μ‹€ν–‰λœλ‹€. μ‹€ν–‰ν•¨μˆ˜λŠ” 보톡 비동기 μž‘μ—…μ„ μ‹œμž‘ν•œ ν›„, λͺ¨λ“  μž‘μ—…μ„ 끝내면 `resolve`λ₯Ό ν˜ΈμΆœν•΄μ„œ `Prom...

Read
javascript

Javascript - Destructuring Assignment

## ꡬ쑰 λΆ„ν•΄ ν• λ‹Ή ꡬ쑰 λΆ„ν•΄ 할당은 λ°°μ—΄μ΄λ‚˜ 객체의 속성을 λ§κ·ΈλŒ€λ‘œ λΆ„ν•΄ν•˜μ—¬, λΆ„ν•΄ ν•œ 값을 κ°œλ³„λ³€μˆ˜μ— 담을 수 있게 λ„μ™€μ£ΌλŠ” ν‘œν˜„μ‹μ΄λ‹€. ```javascript let a, b, rest; [a, b] = [10, 20]; console.log(a); // 10 console.log(b); // 20 // rest νŒ¨ν„΄μ„ μ΄μš©ν•˜μ—¬ λ‚˜λ¨Έμ§€λ₯Ό λͺ¨λ‘...

Read
javascript

Javascript - Closure

## ν΄λ‘œμ € ### μžλ°”μŠ€ν¬λ¦½νŠΈλŠ” μ–΄λ–»κ²Œ λ³€μˆ˜μ˜ 유효 λ²”μœ„λ₯Ό μ •ν•˜λŠ”κ°€? ```javascript function hello() { var name = "yceffort" // λ‚΄λΆ€ν•¨μˆ˜μ΄λ©°, ν΄λ‘œμ €λ‹€. function showName() { // λΆ€λͺ¨ν•¨μˆ˜κ°€ μ„ μ–Έν•œ λ³€μˆ˜λ₯Ό μ‚¬μš©ν•œλ‹€. alert(`hello, ${name}`) }...

Read
react javascript

React κ³΅λΆ€ν•˜κΈ° 5 - Reference

## Reference (Ref) νŠΉμ • DOMμš”μ†Œμ— μž‘μ—…μ„ ν•˜κΈ° μœ„ν•΄μ„œ idλ₯Ό λΆ€μ—¬ν•˜λŠ” 것 처럼, Reactμ—μ„œ DOM에 이름을 λ‹€λŠ” 방식이 μžˆλŠ”λ° 이것이 λ°”λ‘œ ref (Reference)λ‹€. λ°˜λ“œμ‹œ, `DOM에 μ§μ ‘μ μœΌλ‘œ μ ‘κ·Όν•˜μ—¬ μ‘°μž‘μ΄ ν•„μš”ν•  λ•Œ 만 μ΄μš©ν•΄μ•Ό ν•œλ‹€.` ### μ»΄νΌλ„ŒνŠΈ λ‚΄λΆ€μ—μ„œ μ‚¬μš© ```javascript import React, ...

Read
react javascript

React κ³΅λΆ€ν•˜κΈ° 4 - Event

## 이벀트 λ¦¬μ•‘νŠΈμ˜ μ΄λ²€νŠΈλŠ” 기본적으둜 HTML의 μ΄λ²€νŠΈμ™€ λΉ„μŠ·ν•˜μ§€λ§Œ, μ£Όμ˜μ‚¬ν•­μ΄ λͺ‡κ°€μ§€ μžˆμŠ΅λ‹ˆλ‹€. 1. 이벀트 λͺ…은 카멜 μΌ€μ΄μŠ€λ‘œ μž‘μ„±ν•΄μ•Ό ν•œλ‹€. `onclick` β†’ `onClick` 2. μ΄λ²€νŠΈμ— μ‹€ν–‰ν•  μžλ°”μŠ€ν¬λ¦½νŠΈ μ½”λ“œλ₯Ό μ „λ‹¬ν•˜λŠ” 것이 μ•„λ‹ˆκ³ , ν•¨μˆ˜ν˜•νƒœμ˜ 값을 전달해야 ν•œλ‹€. 3. DOMμš”μ†Œμ—λ§Œ μ„€μ •ν•  수 μžˆλ‹€. Custom ComponentλŠ”...

Read
←
β†’