스파르타코딩클럽
[스파르타] 4일차_Javascript 기초 문법 배우기(1-12 ~ 1-14)
yeguu
2022. 5. 6. 17:17
어린이날에도 스파르타 강의를 들으려고 했으나 빨간 날이라서 그런지 집중이 안 되더라ㅠㅠ
하루 쉬었으니 오늘은 열심히 해 보자!
오늘 목표는 1주차 끝내는 것!!
아자!
12. Javascript 맛보기
- 브라우저는 javascript만 알아듣는다.
- java와 javascript는 아무 관련이 없다. (비유하자면 인도와 인도네시아의 관계)
- javascript는 <head> ~ </head> 안에 <script> ~ </script>로 공간을 만들어 작성한다.
13. Javascript 기초 문법 배우기(1)
[크롬 개발자도구]를 열어서 console 탭에서 작성했다.
(혹은 마우스 오른쪽 클릭 -> 검사 -> console)
크롬 개발자도구 콘솔 창은?
-> 띄워놓은 페이지에서 빠르게 javascript를 테스트해 볼 수 있게, 개발자들을 위해 만들어둔 도구
-> 새로고침 하면 모두 사라짐
-> F12 (맥 : alt(option) + command + i)
# 변수
- let a = 2 혹은 let first_name = 'kim'처럼 let 뒤에 오는 변수는 값을 담는 박스다.
- 숫자뿐만 아니라 문자열도 담을 수 있고, 문자열은 ' '가 붙는다. (" " 상관 x)
- 변수 이름 지정할 때는 남이 봐도 알아보기 쉽게 짓는다.
let num = 20
num = 'Bob'let a = 1
let b = 2
a+b // 3
a/b // 0.5
let first = 'Bob'
let last = 'Lee'
first+last // 'BobLee'
first+' '+last // 'Bob Lee'
first+a // Bob1 -> 문자+숫자를 하면, 숫자를 문자로 바꾼 뒤 수행합니다.
## 자료형(리스트&딕셔너리)
리스트 : 순서를 지켜서 가지고 있는 형태
let a_list = [] // 리스트를 선언. 변수 이름은 역시 아무렇게나 가능!
// 또는,
let a_list = [1,2,'hey',3] // 로 선언 가능
a_list[0] // 1 을 출력
a_list[2] // 'hey'를 출력
// 리스트에 요소 넣기
a_list.push('헤이')
a_list // [1, 2, "hey", 3, "헤이"] 를 출력
딕셔너리 : 키(key)-밸류(value) 값의 묶음 / 순서 x
let a_dict = {} // 딕셔너리 선언. 변수 이름은 역시 아무렇게나 가능!
// 또는,
let a_dict = {'name':'bob', 'age':27} // 로 선언 가능
a_dict['name'] // 'bob'을 출력
a_dict['age'] // 27을 출력
a_dict['height'] = 180 // 딕셔너리에 키:밸류 넣기
a_dict // {name: "bob", age: 27, height: 180}을 출력
a_dict['fruits'] = a_list
a_dict // {name: 'bob', age: 27, height: 180, fruits: Array(5)} 출력
a_dict['fruits'][0] // 1 출력리스트와 딕셔너리가 서로의 요소가 될 수 있다.
### 기본 함수들
% : 나눗셈의 나머지
let a = 100 // undefined
a % 7 // 2
a % 8 // 4
대소 관계도 가능하다.
a < 150 // true
a > 200 // false
a == 100 // true
a != 100 // false
.split : 특정 문자 기준으로 문자열 나눌 수 있다.
let myemail = 'sparta@gmail.com'
myemail.split('@') // (2) ['sparta', 'gmail.com']
myemail.split('@')[1] // 'gmail.com'
myemail.split('@')[1].split('.') // (2) ['gmail', 'com']
myemail.split('@')[1].split('.')[0] // 'gmail'
14. Javascript 기초 문법 배우기(2)
# 함수
함수는 정해진 동작을 하는 것!
function sum(num1, num2){
return num1+num2
}
let result = sum(2,3)
result // 5function mysum(num1, num2){
alert('안녕')
return num1+num2
}
let result2 = mysum(2,3)
result2 // 5
## 조건문
let age = 24
if(age > 20) {
console.log('성인입니다')
} else {
console.log('청소년입니다')
}
// 성인입니다
let sex = '남성'
if(age > 20 && sex == '남성') {
console.log('성인 성인입니다')
} else {
console.log('청소년입니다')
}
// 성인 성인입니다- and = &&
- or = ||
if(age > 20) {
console.log('성인입니다')
} else if (age > 7) {
console.log('청소년입니다')
} else {
console.log('아동입니다')
}
// 성인입니다
### 반복문
for (let i = 0; i < 10; i++) {
console.log(i)
}
// 0
// 1
// 2
// 3
// 4
// 5
// 6
// 7
// 8
// 9-> 정처기 필기 공부한 게 나와서 너무 반가웠다ㅠㅠ 역시 아는 만큼 보이는구나..
let people = ['철수','영희','민수','형준','기남','동희']
undefined
for (let i = 0; i < people.length; i++) {
console.log(people[i])
}
// 철수
// 영희
// 민수
// 형준
// 기남
// 동희반복문은 리스트, 딕셔너리와 잘 어울려 사용할 수 있다.
let scores = [
{'name':'철수', 'score':90},
{'name':'영희', 'score':85},
{'name':'민수', 'score':70},
{'name':'형준', 'score':50},
{'name':'기남', 'score':68},
{'name':'동희', 'score':30},
]
scores[0] // {name: '철수', score: 90}
scores[1]['score'] // 85
for (let i = 0; i < scores.length; i++) {
console.log(scores[i])
}
// {name: '철수', score: 90}
// {name: '영희', score: 85}
// {name: '민수', score: 70}
// {name: '형준', score: 50}
// {name: '기남', score: 68}
// {name: '동희', score: 30}
for (let i = 0; i < scores.length; i++) {
console.log(scores[i]['name'])
}
// 철수
// 영희
// 민수
// 형준
// 기남
// 동희
for (let i = 0; i < scores.length; i++) {
let name = scores[i]['name']
let score = scores[i]['score']
console.log(name, score)
}
// 철수 90
// 영희 85
// 민수 70
// 형준 50
// 기남 68
// 동희 30
for (let i = 0; i < scores.length; i++) {
let name = scores[i]['name']
let score = scores[i]['score']
if (score < 70) {
console.log(name, score)
}
}
// 형준 50
// 기남 68
// 동희 30-> console.log(변수) : 콘솔 창에 괄호 안의 값을 출력
오늘 1주 차를 다 끝내려고 했는데 집중력 무슨 일이야ㅠㅠㅠ
집중력 바사삭이라서 오늘은 여기까지..
밥 먹고 GSAT 공부해야겠다.
내일은 꼭..!! 스파르타 1주 차 끝낸다!!!