[1] 변수
let? var?
이전 자바스크립트를 공부할때는 var로 변수 선언을 했지만 요즘 보니 let을 쓰는거 같다.
var = 구식, let = 신식으로 생각 하면 될꺼같다.
변수 선언은 데이터를 담을 박스를 선언하는것과 같다.
박스에 숫자를 넣든 문자를 넣든 데이터를 넣는데는 변수 선언이 필요하다.
간단한 예시를 통해 알아보자.
let num = 1004 // num이라는 변수를 선언함과 동시에 숫자 1004를 집어넣는다.
여기서 num은 변수 이름이다.
=(등호) 기준으로 오른쪽의 데이터를 왼쪽 변수에 넣는다. 라고 이해하면 된다.
문자도 넣어보자
let text = 'apple'
text란 변수에 apple이란 글자 데이터를 넣었다.
각 변수들을 출력해보자
let num = 1004
let text = 'apple'
console.log(num)
console.log(text)
아래처럼 출력되는것을 확인할 수 있다.
1004
apple
좀더 만들어보자
let num = 1004
let num2 = 1004
let text = 'apple'
let text2 = 'love'
숫자끼리 글자끼리 각각 더하면 어떻게 될까
let num = 1004
let num2 = 1004
let text = 'apple'
let text2 = 'love'
console.log(num+num2)
console.log(text+text2)
아래와 같다.
2008
applelove
그렇다면 숫자 + 문자는?
let num = 1004
let num2 = 1004
let text = 'apple'
let text2 = 'love'
console.log(num+text)
console.log(num2+text2)
1004apple
1004love
이처럼 숫자가 글자로 자동 변환되어 출력된다.
[2] 리스트(배열)
간단한 예시를 보자
let list = []
리스트는 [ ] 로 선언한다.
리스트에 데이터를 넣어보자
let list = [1,2,3,4,'apple']
리스트에 데이터를 추가해보자
let list = [1,2,3,4,'apple']
list.push('love')
출력값은
[1, 2, 3, 4, 'apple', 'love']
각 자리의 순번은
0: 1
1: 2
2: 3
3: 4
4: "apple"
5: "love"
원하는 자리 1과 2사이에 'black'이라는 글자를 넣어보자
1번 자리에 추가하면 된다.
let list = [1,2,3,4,'apple']
list.splice(1,0,'black') 1번 자리에 넣기
[1, 'black', 2, 3, 4, 'apple']
0: 1
1: "black"
2: 2
3: 3
4: 4
5: "apple"
원하는 자리의 데이터을 바꿔보자
2번 데이터를 black로 바꿔보자
let list = [1,2,3,4,'apple']
list.splice(2,1,'black')
[1, 2, 'black', 4, 'apple']
0: 1
1: 2
2: "black"
3: 4
4: "apple"
[3] 딕셔너리(객체)
리스트와 비슷하다.
let dict = {'name':'Bob','age':21}
dict라는 딕셔너리 변수 선언
오른쪽 데이터는 딕셔너리에 들어가는 데이터들이며 'name' 과 'Bob' 그리고 'age' : 21은 각각 매칭되어있다.
매칭된 값을 출력해보자
let dict = {'name':'Bob','age':21}
dict.name
'Bob'
위와 같이 출력된다. 같은 원리로 dict.age 하면 21이 출력된다.
그렇다면 새로운 데이터를 넣어보자
let dict = {'name':'Bob','age':21}
dict['height'] = 188 // heigt 데이터 넣기
{name: 'Bob', age: 21, height: 188}
위와 같이 출력된다.
리스트 & 딕셔너리를 같이 써보자
names = [{'name':'bob','age':20},{'name':'carry','age':38}]
0: {name: 'bob', age: 20}
1: {name: 'carry', age: 38}
위와 같이 출력되며 방대한 데이터를 정리하기에는 필연적인 문법인것같다.
나중에 심화로 들어가면 어려워질것같다.
[4] 함수
함수는 특정 기능을 하는 변수같은 것이다.
function 함수이름(안에 쓰일 변수들) {
함수 기능
}
함수이름(함수로 보낼 데이터);
숫자 2개를 더해주는 함수를 만들고 이용해보자
function sum(num1, num2) {
console.log('num1: ', num1, ', num2: ', num2);
return num1 + num2;
}
let result = sum(10,10)
console.log(result)
result란 변수를 선언하였고 여기엔 sum(10,10)을 넣는다.
sum(10,10)은 sum이란 함수에 10,10데이터를 넣고
데이터를 리턴받는다.
함수를 살펴보면 받은 2개의 데이터를 각각 num1, num2로 선언하고
두개를 각각 출력한뒤 더한값을 return 해준다.
'코딩 > 기타' 카테고리의 다른 글
[HTML] 1. html 기본 구조에 대해... (1) | 2022.08.30 |
---|---|
[Start] Day-1 첫 시작... (1) | 2022.08.29 |