Frontend ๐Ÿ“š/JavaScript 4

[JS] ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ž€

1. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ ํŠน์ง•์ž๋ฐ”์Šคํฌ๋ฆฝํŠธHTML, CSS์™€ ํ•จ๊ป˜ ์›น์„ ๊ตฌ์„ฑํ•˜๋Š” ์š”์†Œ ์ค‘ ํ•˜๋‚˜๋กœ ์›น ๋ธŒ๋ผ์šฐ์ €์—์„œ ๋™์ž‘ํ•˜๋Š” ์œ ์ผํ•œ ํ”„๋กœ๊ทธ๋ž˜๋ฐ ์–ธ์–ด์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋Š” ๊ฐœ๋ฐœ์ž๊ฐ€ ๋ณ„๋„์˜ ์ปดํŒŒ์ผ ์ž‘์—…์„ ์ˆ˜ํ–‰ํ•˜์ง€ ์•Š๋Š” ์ธํ„ฐํ”„๋ฆฌํ„ฐ ์–ธ์–ด์ธํ„ฐํ”„๋ฆฌํ„ฐ๋Š” ์†Œ์Šค์ฝ”๋“œ๋ฅผ ์ฆ‰์‹œ ์‹คํ–‰ํ•˜๊ณ , ์ปดํŒŒ์ผ๋Ÿฌ๋Š” ๋น ๋ฅด๊ฒŒ ๋™์ž‘ํ•˜๋Š” ๋จธ์‹  ์ฝ”๋“œ๋ฅผ ์ƒ์„ฑํ•˜๊ณ  ์ตœ์ ํ™” ํ•จ์ด๋ฅผ ํ†ตํ•ด ์ปดํŒŒ์ผ ๋‹จ๊ฒŒ์—์„œ ์ถ”๊ฐ€์ ์ธ ์‹œ๊ฐ€๋‹ ํ•„์š”ํ•จ์—๋„ ๋”์šฑ ๋น ๋ฅด๊ฒŒ ์ฝ”๋“œ๋ฅผ ์‹คํ–‰ํ•  ์ˆ˜ ์žˆ์Œ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋Š” ๋Ÿฐํƒ€์ž„์— ์ปดํŒŒ์ผ๋˜๋ฉฐ ์‹คํ–‰ ํŒŒ์ผ์ด ์ƒ์„ฑ๋˜์ง€ ์•Š๊ณ  ์ธํ„ฐํ”„๋ฆฌํ„ฐ์˜ ๋„์›€ ์—†์ด ์‹คํ–‰ํ•  ์ˆ˜ ์—†๊ธฐ ๋•Œ๋ฌธ์— ์ปดํŒŒ์ผ๋Ÿฌ ์–ธ์–ด๋ผ๊ณ  ํ•  ์ˆ˜๋Š” ์—†์Œ

[JS] for...of ๋ช…๋ น๋ฌธ

์˜ค๋Š˜์€ ์ž๋ฐ”์ŠคํŠธ๋ฆฝํŠธ์˜ ๋ฐ˜๋ณต๋ฌธ ์ค‘ ํ•˜๋‚˜์ธ for...of ๋ช…๋ น๋ฌธ์— ๋Œ€ํ•ด ๊ณต๋ถ€ํ•ด๋ณด์ž.for...of ๋ช…๋ น๋ฌธ์€ ๋ฐ˜๋ณต๊ฐ€๋Šฅํ•œ ๊ฐ์ฒด(์˜ˆ๋ฅผ ๋“ค์–ด Array, TypedArray, Set, Map...)์— ๋Œ€ํ•ด์„œ ๋ฐ˜๋ณตํ•˜๊ณ  ๊ฐ ๊ฐœ๋ณ„ ์†์„ฑ๊ฐ’์— ๋Œ€ํ•ด ์‹คํ–‰๋˜๋Š” ๋ฌธ์ด ์žˆ๋Š” ์‚ฌ์šฉ์ž ์ •์˜ ๋ฐ˜๋ณต ํ›„ํฌ๋ฅผ ํ˜ธ์ถœํ•˜๋Š” ๋ฃจํ”„๋ฅผ ์ƒ์„ฑํ•œ๋‹ค.๊ตฌ๋ฌธfor (variable of iterable) { statement;}variable๊ฐ ๋ฐ˜๋ณต์— ์„œ๋กœ ๋‹ค๋ฅธ ์†์„ฑ๊ฐ’์ด variable์— ํ• ๋‹น๋œ๋‹ค.iterable๋ฐ˜๋ณต๋˜๋Š” ์—ด๊ฑฐ๊ฐ€๋Šฅ(enumerable)ํ•œ ์†์„ฑ์ด ์žˆ๋Š” ๊ฐ์ฒด. ์˜ˆ์ œlet iterable = [10, 20, 30];for (let value of iterable) { // let ๋Œ€์‹  const ์‚ฌ์šฉ๋„ ๊ฐ€๋Šฅ console.log(value);}..

[JS] parseInt() ์‚ฌ์šฉ ๋ฐฉ๋ฒ•

์˜ค๋Š˜์€ ์ž๋ฐ”์Šคํฌ๋ฆฝ์˜ parseInt() ํ•จ์ˆ˜์— ๋Œ€ํ•ด ๊ณต๋ถ€ํ•ด๋ณด์ž.parseInt() ํ•จ์ˆ˜๋Š” ๋ฌธ์ž์—ด ์ธ์ž๋ฅผ ํŒŒ์‹ฑํ•˜์—ฌ ํŠน์ • ์ง„์ˆ˜์˜ ์ •์ˆ˜๋ฅผ ๋ฐ˜ํ™˜ํ•œ๋‹ค. (ํŒŒ์‹ฑ์ด๋ž€ ๋ฐ์ดํ„ฐ๋ฅผ ๋ถ„ํ•ด ๋ถ„์„ํ•ด์„œ ์›ํ•˜๋Š” ํ˜•ํƒœ๋กœ ์กฐ๋ฆฝํ•˜๊ณ  ๋‹ค์‹œ ๋นผ๋‚ด๋Š” ํ”„๋กœ๊ทธ๋žจ)๊ตฌ๋ฌธparseInt(string);parseInt(string, radix); ๋งค๊ฐœ๋ณ€์ˆ˜stringํŒŒ์‹ฑํ•  ๊ฐ’์ด๋‹ค. ๋ฌธ์ž์—ด์ด ์•„๋‹Œ ๊ฒฝ์šฐ toString ์ถ”์ƒ ์—ฐ์‚ฐ์„ ์‚ฌ์šฉํ•ด ๋ฌธ์ž์—ด๋กœ ๋ณ€ํ™˜ํ•  ๊ฒƒ์ด๋‹ค. ๋ฌธ์ž์—ด์˜ ์„ ํ–‰ ๊ณต๋ฐฑ์€ ๋ฌด์‹œํ•œ๋‹ค.radixstring์˜ ์ง„์ˆ˜๋ฅผ ๋‚˜ํƒ€๋‚ด๋Š” 2๋ถ€ํ„ฐ 36๊นŒ์ง€์˜ ์ •์ˆ˜์ด๋‹ค. ์ฃผ์˜! ๊ธฐ๋ณธ ๊ฐ’์ด 10์ด ์•„๋‹ˆ๋‹ค! Number ์ž๋ฃŒํ˜•์ด ์•„๋‹Œ ๊ฒฝ์šฐ Number๋กœ ๋ณ€ํ™˜ํ•œ๋‹ค. ๋ฐ˜ํ™˜ ๊ฐ’์ฃผ์–ด์ง„ string์—์„œ ํŒŒ์‹ฑํ•œ ์ •์ˆ˜์ด๋‹ค. ์•„๋ž˜์™€ ๊ฐ™์€ ๊ฒฝ์šฐ์—๋Š” NaN์„ ๋ฐ˜ํ™˜ํ•œ๋‹ค.radix๊ฐ€ 2๋ณด๋‹ค ..

[JS] Constructor(์ƒ์„ฑ์ž)๋ž€?

์˜ค๋Š˜์€ ์ž๋ฐ”์Šคํฌ๋ฆฝ์˜ Constructor ๋ฉ”์„œ๋“œ์— ๋Œ€ํ•ด ๊ณต๋ถ€ํ•ด๋ณด์ž.Constructor ๋ฉ”์„œ๋“œ๋Š” ํด๋ž˜์Šค์˜ ์ธ์Šคํ„ด์Šค ๊ฐ์ฒด๋ฅผ ์ƒ์„ฑํ•˜๊ณ  ์ดˆ๊ธฐํ™”ํ•˜๋Š” ํŠน๋ณ„ํ•œ ๋ฉ”์„œ๋“œ๋กœ ์‰ฝ๊ฒŒ ๋งํ•ด ์ƒ์„ฑ์ž์ด๋‹ค.ํŒŒ์ด์ฌ์˜ ๊ฒฝ์šฐ ํด๋ž˜์Šค์—์„œ __init__์œผ๋กœ ๋ณ€์ˆ˜๋ฅผ ์ดˆ๊ธฐํ™”ํ•˜๋Š” ๊ฒƒ๊ณผ ๋™์ผํ•œ ์—ญํ• ์„ ํ•œ๋‹ค๊ณ  ์ดํ•ดํ•˜๋ฉด ๋œ๋‹ค.๊ตฌ๋ฌธconstructor() { ... }constructor(argument0) { ... }constructor(argument0, argument1) { ... }constructor(argument0, argument1, ... , argumentN) { ... } ์„ค๋ช…Constructor๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ๋‹ค๋ฅธ ๋ชจ๋“  ๋ฉ”์„œ๋“œ ํ˜ธ์ถœ๋ณด๋‹ค ์•ž์„  ์‹œ์ ์ธ, ์ธ์Šคํ„ดํŠธ ๊ฐ์ฒด๋ฅผ ์ดˆ๊ธฐํ™”ํ•  ๋•Œ ์ˆ˜ํ–‰ํ•  ์ดˆ๊ธฐํ™” ์ฝ”๋“œ๋ฅผ ์ •์˜ํ•  ์ˆ˜ ์žˆ๋‹ค.class P..