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

// 개발일지 쓰기전 잡설

코딩을 공부해보고 싶어서 내일배움단으로 신청했다. 이제 1주차.

10몇년 전 대학때 C++ 기초정돈 배웠던 적이 있어서인지 아주 쉬운개념은 비슷해서 바로 이해 됬으나

무슨 최신 방식인지 뭔지 생소한것들 이 나오니까 거기서부터 이해가 안되기 시작..

근데 강의노트 고심해서 읽다보면 이해가 조금씩 되는거 같은데 좀더 봐야할거 같다.

강의노트 만세

남들 보니까 개발일지들 멋지게 써놨던데,, 공부할때마다 연습장이다 생각하고 적어봐야겠다

//

 

1주차 Javascript

 

1. 변수 선언 let 

    // let으로 통일 => 매우편함 

    // 예전에 c배울때 int인지 char인지 뭔지 뒤에 오는거 종류별로 다 따져서 선언했던거 같은데 세상 좋아졌다

 

2. 리스트(배열) & 딕셔너리(객체)  

리스트(배열 Array): 순서를 지켜서 가지고 있는 형태

let b_list = [1,2,'hey',3]  // 리스트를 선언. 

// 리스트에 요소 넣기 b_list.push('헤이')  ->  b_list // [1, 2, "hey", 3, "헤이"] 를 출력

 

딕셔너리(객체): 키(key)-밸류(value) 값의 묶음

let b_dict = {'name':'Bob','age':21}// 딕셔너리 선언. 

//딕셔너리에 키:밸류 넣기 b_dict['height'] = 180  -> b_dict // {name: "Bob", age: 21, height: 180}을 출력

 

리스트와 딕셔너리의 조합

names = [{'name':'bob','age':20},{'name':'carry','age':38}]

// names[0]['name']의 값은? 'bob'

// names[1]['name']의 값은? 'carry'

 

3. 함수

// 만들기

function 함수이름(필요한 변수들) {

    내릴 명령들을 순차적으로 작성

}

// 사용하기

함수이름(필요한 변수들);

 

// 두 숫자를 입력받으면 더한 결과를 돌려주는 함수
function sum(num1, num2) {
console.log('num1: ', num1, ', num2: ', num2);

//return 으로 값을 돌려주는, 뱉는 구조로 변수에 값을 전달 할 수도 있습니다.
return num1 + num2;
}

sum(3, 5); // 8
sum(4, -1); // 3
let result = sum(10,10)
console.log(result) // 20

 

또다른 함수 선언 방식

let a = function(){
console.log("리터럴 방식 이라고 합니다");
}
a()

 // => 이부분 당장은 이해가 안됨

 

4. 조건문 if, else if, else

 

function is_adult(age){
if(age > 20){
alert('성인이에요')
} else if (age > 10) {
alert('청소년이에요')
} else {
alert('10살 이하!')
}
}

is_adult(12)

 

 

5. 반복문

for (let i = 0; i < 100; i++) {
console.log(i);
}

 

for (1. 시작조건; 2. 반복조건; 3. 더하기) {
4. 매번실행
}

1 -> 2체크하고 -> (괜찮으면) -> 4 -> 3
-> 2체크하고 -> (괜찮으면) -> 4 -> 3
-> 2체크하고 -> (괜찮으면) -> 4 -> 3
-> 2체크하고 -> (괜찮으면) -> 4 -> 3

와 같은 순서로 실행됩니다.
i가 증가하다가 반복조건에 맞지 않으면, 반복을 종료하고 빠져나옵니다.

 

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

[기존 방식]
let a = function() {
  console.log("function");
}
a();

 

[최신 방식]

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

 

6. 딕셔너리 키와 값을 빠르게 꺼내기! - 비구조 할당

//객체 
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)

 

 

7.딕셔너리를 짧게 만들어보기! - 객체 리터럴

[기존 방식]

var name = "스파르타";
var job = "developer";

var user = {
  name: name,
  job: job
}

console.log(user);
//{name: "스파르타", job: "developer"}

 

[최신 방식]

var name = "스파르타";
var job = "developer";

var user = {
  name,
  job
}

console.log(user);
//{name: "스파르타", job: "developer"}

 

8. map -반복문의 또 다른 방식

리스트(배열)를 순회하여 값을 꺼내 확인할 땐 다음과 같이 for 반복문을 사용했습니다.

let numbers = [1,2,3,4,5,6,7];
for(let i=0; i<numbers.length; i++){
console.log(numbers[i]);
}