day10

์ƒ์€๐Ÿ‘ธยท2023๋…„ 10์›” 22์ผ
1

๋šœ๋ฒ…๋šœ๋ฒ… ๋‘๋ฒˆ์งธ

๋ชฉ๋ก ๋ณด๊ธฐ
4/13
post-thumbnail
post-custom-banner

๐Ÿ“– JavaScript

=> ์›น Html, CSS, JS ์Šคํฌ๋ฆฝํŠธ์–ธ์–ด (์ธํ„ฐํ”„๋ฆฌํ„ฐ ์–ธ์–ด)
=> ํ•œ์ค„ํ•œ์ค„ ๋ณด๋ฉด์„œ ์˜ค๋ฅ˜์ฒดํฌ

๋‚ด๋ถ€์Šคํฌ๋ฆฝํŠธ, ์™ธ๋ถ€์Šคํฌ๋ฆฝํŠธ

1. ๋‚ด๋ถ€์Šคํฌ๋ฆฝํŠธ

bodyํƒœ๊ทธ ๋๋‚˜๊ธฐ ์ „์—

<script>
	console.log('console ์ฐฝ์— ์ถœ๋ ฅ 1');
</script>

=> ๊ทธ๋ฆฌ๊ณ  ์›น ๋ธŒ๋ผ์šฐ์ €์ฐฝ ๋“ค์–ด๊ฐ€์„œ ๊ฐœ๋ฐœ์ž๋„๊ตฌ -> ์ฝ˜์†”์ฐฝ์œผ๋กœ ๋ณด๋ฉด 'console ์ฐฝ์— ์ถœ๋ ฅ 1' ์ถœ๋ ฅ!

2. ์™ธ๋ถ€์Šคํฌ๋ฆฝํŠธ

์™ธ๋ถ€ CSS ์ ์šฉํ•˜๋Š”๊ฑฐ๋ž‘ ๋˜‘๊ฐ™์ด ํŒŒ์ผ๋ช….js๋กœ ํŒŒ์ผ๋งŒ๋“ค์–ด์ฃผ๊ณ 

<script src="./js1.js"></script>

์ด๋ ‡๊ฒŒ ์ ์šฉ!

=> code Runner๋ž‘ Node.js ์„ค์น˜ํ•˜๊ณ ๋‚˜์„œ
=> ctrl + alt + n ๋ˆ„๋ฅด๋ฉด ์ฝ˜์†”์ฐฝ์ด ๋ณด์ธ๋‹ค

์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ

1. ๋ณ€์ˆ˜

  • ํƒ€์ž…๋ณ€์ˆ˜๋ช… = ๊ฐ’;
  • const(์ƒ์ˆ˜) , let(๋ณ€์ˆ˜) ์„ ๋งŽ์ด ์“ด๋‹ค!!
  • var๋Š” ๋ณ€์ˆ˜๋ช… ์ค‘๋ณต์ฒดํฌ๋„ ์•ˆ๋˜๊ณ  ํ˜ธ์ด์ŠคํŒ…(์ถœ๋ ฅ๋จผ์ €ํ•˜๊ณ  ๋’ค์— ์„ ์–ธํ•ด๋„ ์˜ค๋ฅ˜๊ฐ€ ์•ˆ๋‚˜๋Š”)๋•Œ๋ฌธ์— ์š”์ƒˆ ๋ณ„๋กœ์•ˆ์“ฐ๋Š” ์ถ”์„ธ!
  • ์ˆซ์žํ˜•, ๋ฌธ์žํ˜• ํƒ€์ž…์„ ๋”ฐ๋กœ ๊ตฌ๋ณ„X
  • ๋ฌธ์žํ˜•์“ธ๋•Œ ''; ""; ๋‘˜๋‹ค ๊ฐ€๋Šฅ!

๐Ÿค™
let v1 = 10;
let v2 = 123.123;
let v3 = '๋ฌธ์ž';
let v4 = "์ด๊ฒƒ๋„ ๋ฌธ์ž";

๐Ÿค™
const v8 = 10; //์ƒ์ˆ˜ํ˜• ๋ณ€์ˆ˜ํƒ€์ž…์ด๋ผ ์ดํ›„์— ๊ฐ’์„ ์ˆ˜์ •x
v8 = 20; (X)

2. ์ž๋ฃŒํ˜•

1) ๋ฌธ์ž์—ด

  • ํ…œํ”Œ๋ฆฟ ๋ฌธ์ž์—ด : `` ๋ฐฑํ‹ฑ
  • ${๋‹ค๋ฅธ๋ณ€์ˆ˜}

๐Ÿค™
let str1 = ๋ฐฑํ‹ฑ์œผ๋กœ ๊ฐ์‹ธ๋ฉด ํฐ" ์ž‘์€' ์‹ ๊ฒฝ์•ˆ์“ฐ๊ณ  ์ž‘์„ฑ๊ฐ€๋Šฅ;

๐Ÿค™
let n1 = 2;
let n2 = 10;
let result1 = n1 + ' ' + n2 + ' = ' + (n1n2);
let result2 = ${n1} * ${n2} = ${n1 * n2};
=> 2 * 10 = 20 ์ถœ๋ ฅ!!

2) ์ˆซ์žํ˜• : ์ •์ˆ˜ํ˜•, ์‹ค์ˆ˜ํ˜•
3) ๋…ผ๋ฆฌํ˜• : true, false
4) ๊ธฐํƒ€ํ˜•

  • null : ๋น„์›Œ์ ธ์žˆ๋‹ค ๊ณต๊ฐ„์—†๋‹ค
  • undefined : ๊ฐ’์ด ์•ˆ๋“ค์–ด์žˆ๋‹ค ์ •์˜๋งŒ ๋˜์žˆ๋Š”
  • NaN : Not a Number ์ˆซ์žํ˜•์ด ์•„๋‹ˆ๋‹ค

5) ๋ฐฐ์—ด : []
๐Ÿค™
let arr = [1,2,3,4,5];
let arr2 = ['A', 'B', 'C'];
console.log(arr); => [1, 2, 3, 4, 5]
console.log(arr2); => ['A', 'B', 'C']

6) ๊ฐ์ฒด : {}
=>
๐Ÿค™
let student1 = {
id:'mystu',
name:'๋‚ด์ด๋ฆ„',
age:30
};

console.log(student1); => { id: 'mystu', name: '๋‚ด์ด๋ฆ„', age: 30 }
console.log(student1.id); => mystu
console.log(student1.name); => ๋‚ด์ด๋ฆ„

๐Ÿ“Œ ๋ฐฐ์—ด , ๊ฐ์ฒด

let pizza = {
type:'ํ”„๋ฆฌ๋ฏธ์—„',
price:23000,
base: { //๊ฐ์ฒด ์•ˆ์— ๊ฐ์ฒด!
dough:"๋ฐ€๊ฐ€๋ฃจ",
cheese:"๊ตญ์‚ฐ์น˜์ฆˆ"
},
topping:['ํ–„', '์ƒˆ์šฐ', 'ํŒŒ์ธ์• ํ”Œ'] //๊ฐ์ฒด ์•ˆ์— ๋ฐฐ์—ด!
};

console.log(pizza.price); => 23000
console.log(pizza.base.dough); => ๋ฐ€๊ฐ€๋ฃจ
console.log(pizza.topping[2]); => ํŒŒ์ธ์• ํ”Œ

profile
๋’ค์ฃฝ๋ฐ•์ฃฝ ๋ฒจ๋กœ๊ทธ
post-custom-banner

0๊ฐœ์˜ ๋Œ“๊ธ€