[스파르타코딩클럽/앱개발종합반]1주차 개발일지

자바스크립트 기초문법 정리 - base for app dev

변수 let vs const

const num2 = 1000

num2 = 2000
console.log(num2)

---

결과: error
const는 고정된 변수!!

---

let a_list = [1,2,3,4,'gunhee',6,'kim']
console.log(a_list[4])
결과: gunhee

a_list.push('sparta')
console.log(a_list)
출력결과: [1, 2, 3, 4, "gunhee", 6, "kim", "sparta"]

---

딕셔너리
let a_dict = {"name":"gunhee","age":30} //앞에는 key, 뒤에는 value
console.log(a_dict["name"])
gunhee

let names = [{"name":"gunhee","age":30},{"name":"gunhee2","age":30}]
console.log(names)

names[1]["age"]
30

let a = 20
let b = 7
console.log(a % b)
6

---

대문자변경

let myname = "kimgunhee"
console.log(myname.toUpperCase())

문장 나누기 - split함수

let email = "gunheekim@gmail.com"
console.log(email.split('@'))

console.log(email.split('@')[1].split('.'))
 ["gmail", "com"]
 
console.log(email.split('@')[1].split('.')[1])
com

let txt = "서울시-마포구-망원동"
let names = txt.split("-")
console.log(names)
 ["서울시", "마포구", "망원동"]

---

<함수기능>

 function funcNum(num1,num2){
    console.log(num1 + num2)
}

funcNum(10,20)
30

``` function minus(num1, num2) { return num1 - num2 }

let result = minus(100,10)
console.log(result)
90

let a = function() {

console.log("리터럴 함수 방식")

}

a()
출력결과 : 리터럴 함수 방식

조건문

 

  function is_adult(age){
    if(age > 20){
        console.log("성인")

    }else if(age > 10){
        console.log("청소년")

    }else{
        console.log("어린이")

    }
    

}

is_adult(30)


vendors~main-459f67ab0d3e96b07a6f.js:1 성인
is_adult(17)
is_adult(7)
vendors~main-459f67ab0d3e96b07a6f.js:1 청소년
vendors~main-459f67ab0d3e96b07a6f.js:1 어린이
  

// AND 조건은 이렇게
function is_adult(age, sex){
if(age > 20 && sex == '여'){
alert('성인 여성')
} else if (age > 20 && sex == '남') {
alert('성인 남성')
} else {
alert('청소년이에요')
}
}

// 참고: OR 조건은 이렇게
function is_adult(age, sex){
if (age > 65 || age < 10) {
alert('탑승하실 수 없습니다')
} else if(age > 20 && sex == '여'){
alert('성인 여성')
} else if (age > 20 && sex == '남') {
alert('성인 남성')
} else {
alert('청소년이에요')
}
}

is_adult(25,'남')

---

let scores = [
{'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: "철수", score: 90}
vendors~main-459f67ab0d3e96b07a6f.js:1 {name: "영희", score: 85}
vendors~main-459f67ab0d3e96b07a6f.js:1 {name: "민수", score: 70}
vendors~main-459f67ab0d3e96b07a6f.js:1 {name: "형준", score: 50}
vendors~main-459f67ab0d3e96b07a6f.js:1 {name: "기남", score: 68}
vendors~main-459f67ab0d3e96b07a6f.js:1 {name: "동희", score: 30}

let scores = [
{'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++) {
if(scores[i]['score'] <70) {
console.log(scores[i]);
}

}

// 이렇게 하면 리스트 내의 딕셔너리를 하나씩 출력할 수 있고,
vendors~main-459f67ab0d3e96b07a6f.js:1 {name: "형준", score: 50}
vendors~main-459f67ab0d3e96b07a6f.js:1 {name: "기남", score: 68}
vendors~main-459f67ab0d3e96b07a6f.js:1 {name: "동희", score: 30}

<반복문>
let people = ['철수','영희','민수','형준','기남','동희']

// 이렇게 하면 리스트의 모든 원소를 한번에 출력할 수 있겠죠?
// i가 1씩 증가하면서, people의 원소를 차례대로 불러올 수 있게 됩니다.
for (let i = 0 ; i < people.length ; i++) {
console.log(people[i])
}

함수를 더 짧게! - 화살표 함수

[기존 방식]

let a = function() {
  console.log("function");
}
a();

[최신 방식]

let a = () => {
  console.log("arrow function");
}
a();.

//객체
let blog = {
owner : "noah",
url : "noahlogs.tistory.com",
getPost() {
console.log("ES6 문법 정리");
}
};

//기존 할당 방식
let owner = blog.owner
let getPost = blog.getPost()

//비구조 할당 방식
let { owner, getPost } = blog;
//각각 blog 객체의 owner , getPost() 의 데이터가 할당
//blog의 키 값과 이름이 같아야 해요!
//(예 - owner가 아니라 owner2를 넣어보세요! 아무것도 안 들어온답니다.)

---

앞으로 리액트 네이티브 앱을 만들며 가장 많이 사용할 방식

//함수에서 비구조 할당 방식으로 전달된 딕셔너리 값 꺼내기
let blogFunction = ({owner,url,getPost}) => {
console.log(owner)
console.log(url)
console.log(getPost())
}

blogFunction(blog)

<리터럴>
let name = "김건희"
let str2 = 내 이름은 ${name}
console.log(str2)
내 이름은 김건희

---

1주차 숙제

(1) let fruit_list = ['사과','감','감','배','포도','포도','딸기',
'포도','감','수박','딸기']

let count = 0;

fruit_list.map((f)=>{
if(f == '사과'){
count += 1
}

})

console.log(count)

---

(2)function checkEmail(email){
if(email.indexOf('@')== -1){
console.log("이메일이 아닙니다.")
}else{
console.log("이메일이 맞습니다.")

}

}

checkEmail('gunhee21@gmail.com') // 이메일이 맞습니다
checkEmail('gunhee21$gmail.com') // 이메일이 아닙니다.

---

(3)function checkEmail(email){
var regExp = /^0-9a-zA-Z@0-9a-zA-Z.[a-zA-Z]{2,3}$/i;
if (regExp.test(email)){
console.log("이메일이 맞습니다.")
}else{
console.log("이메일이 아닙니다.")
}

}

checkEmail('gunhee21@gmail.com') // 이메일이 맞습니다
checkEmail('gunhee21$gmail.com') // 이메일이 아닙니다.