개발 환경 세팅
- VSCode 설치
- 안드로이드 스튜디오 - 배포용 도구로 쓸 것
- (windows) node, npm
- (mac) Xcode, node, npm
JavaScript 는 무엇?
- 기존에는 웹에 쓰이는 언어였는데, React 네이티브가 JS를 기반으로 하기때문에 앱을 만들수 있음
- 크롬 개발자 콘솔에서 JS 코드 바로 확인 가능
- 윈도우는 : F12(Console)
- 맥은 : alt(option) + command + i
Javascript 기초 문법1 - 변수
- JS는 코드 마지막에 ; 안써도 된다! 그래도 쓰자. c#이랑 헷갈린다
- JS에서 배열과 리스트는 같다 // C# 배울때는 Array, List 따로 배웠던거같은데
- 변수 let, var 둘다 씀
- 객체 = 딕셔너리 // C#에서는 객체 = 인스턴스로 기억하고 있음 슬쩍슬쩍 용어들이 다르나 이해하는데 별 차이는 없어보임
변수
- 오른쪽에 있는거를 왼쪽에 넣는것
- 변수 선언은 let, var는 구식 선언 방식
- 찾아보니 let은 재선언시 에러띄워줌 // SyntaxError : ~~has already been declared
- 선언은 한번만.
let num = 20
num = 'Bob'
// 한 번 선언했으면, 다시 선언하지 않고 값을 넣습니다.
- JS에서는 자료형 선언 없이 바로 사칙연산 가능
- Shift+Enter가 줄바꿈, Enter는 실행
- snake_case 나 camelCase로 변수 선언
let a = 1
let b = 2
console.log(a+b) // 3
console.log(a/b) // 0.5
let first = 'Bob'
let last = 'Lee'
console.log(first+last) // 'BobLee'
console.log(first+' '+last) // 'Bob Lee'
console.log(first+a) // Bob1 -> 문자+숫자를 하면, 숫자를 문자로 바꾼 뒤 수행합니다.
const value_fix = 'a' // 재할당 불가한 상수
Javascript 기초 문법2 - 리스트(배열) & 딕셔너리(객체)
- 리스트(대괄호) : 프로그래밍에서 순서는는 0부터 시작
- 모양은 C#의 배열과 같은데, 사용법은 리스트와 유사하다
let a_list = []; // 리스트 선언
let b_list = [1,2,'hey',3];
// 추가는 push, 맨 뒤에 추가됨
b_list.push('헤이');
b_list.length // 5
- 딕셔너리(중괄호) : key와 value 의 묶음으로 구성
- C#의 sortedList와 유사한 활용으로 보인다
- 대괄호로 자료 바로 추가
let a_dict = {} // 딕셔너리 선언. 변수 이름은 역시 아무렇게나 가능!
// 또는,
let b_dict = {'name':'Bob','age':21} // 로 선언 가능
b_dict['name'] // 'Bob'을 출력
b_dict['age'] // 21을 출력
b_dict.name // 'Bob'을 출력 6번줄과 동일하다
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' 리스트 0번째 자료의 name
// names[1]['name']의 값은? 'carry' 리스트 1번째 자료의 name
// 전체적인 형태는 리스트 이므로 push로 값을 넣음
new_name = {'name':'john','age':21}; //새로운 딕셔너리 선언
names.push(new_name);
let customer = [
{'name': '김스파', 'phone': '010-1234-1234'},
{'name': '박르탄', 'phone': '010-4321-4321'}
]
- JSONVue (크롬 확장프로그램)으로 JSON 자료를 깔끔하게 볼 수 있음
Javascript 기초 문법3 - 함수, 조건문, 반복문
기본 제공 함수들
- 구글 검색해서 쓰자
- 사칙연산 +-*/
- 대문자로 바꾸기
let myname = 'spartacodingclub'
myname.toUpperCase() // SPARTACODINGCLUB
- 특정 문자로 문자열 나누기
- 맨아랫줄을 함수형 프로그래밍이라고 하는데, 코드가 좀 지저분해진다.
let myemail = 'sparta@gmail.com'
let result = myemail.split('@') // ['sparta','gmail.com'] 리스트로 만들어줌
result[0] // sparta
result[1] // gmail.com
let result2 = result[1].split('.') // ['gmail','com']
result2[0] // gmail -> 우리가 알고 싶었던 것!
result2[1] // com
myemail.split('@')[1].split('.')[0] // gmail -> 간단하게 쓸 수도 있다!
함수
let y = f(x);
// JS 에서는 function을 사용
function 함수이름(필요한 변수들){
내릴명령
}
// 사용하기
함수이름(변수);
function f(x){
console.log(x)
}
f(10) // 10 이라는 로그가 찍힘
- 함수에서 값은 return으로 받는 것은 C#과 동일
- 리터럴 방식 //이게 더 익숙하다
let a = function(){
console.log()
}
a()
