$$config title: 프로그래머스 자바스크립트 입문 keywords: - IT - Javascript $$ # javascript 기초 ## ① 명령어 1) console.log ("a"); : 출력 명령어
2) prompt -> 명령어 입력받아 넘겨주는 역할 var name=prompt("이름을 입력해 주세요."); console.log(name, "님 환영합니다."); 를 입력하면 "이름을 입력해주세요" 라는 창이 뜨고, 이름을 입력하면 "이름" 님 환영합니다. 라는 메세지가 뜸
3) typeof -> 변수가 어떤 자료형인지 나타내주는 명령어 4) parseInt -> 정수부분만 추출하여 저장 (문자 출력x) 5) parseFloat -> 실수까지 추출하여 저장 (문자 출력x) 6) Math.pow(a,b) -> a의 b승 7) Math.sqrt(a) -> 제곱근 8) Math.random() -> 난수 (임의의 숫자) 반환 9) .length -> 문자열의 길이를 알아내는 명령어 / 배열의 개수 를 알아낼때도 사용 !!!! 10) .concat(a) -> 여러개의 문자열을 이어붙이는 명령어 11) indexOf(str) / lastIndexOf(str) -> str이 위치한 첫번째 / 마지막 위치 알려주는 명령어 12) .pop : 배열의 마지막 엘리먼트를 제거하여 반환 <-> .shift : 배열의 가장 처음 엘리먼트를 제거하여 반환 13) .push : 배열의 맨 뒤에 새로운 엘리먼트 추가 <-> .unshift : 배열의 맨 앞에 새로운 엘리먼트 추가 14) .reverse : 배열의 값 뒤집음 / .sort : 배열의 값 정렬 15) .split : 문자열을 구분자로 나눠 각각을 담을 배열을 반환하는 함수 　　　　ex) var str = "1,2,3,4,5"; 　　　　　　arr = str.split(","); 　　　　　　　- - > arr = ["1", "2", "3", "4", "5"]; 16) Object.keys : 객체 배열하는 함수 ## ② 기본자료형 1) number type : 숫자형 -> 정수와 실수, 지수 모두 표기 가능 2) string type : 문자형 3) boolean type : 참 (true)/ 거짓(false) ## ③ 객체 객체란 ? 속성의 집합 - 속성 정의 : {name1: value1, name2: value2...} ex) var man = {name: "홍길동", age: 20, height: 180}; - 속성의 값 불러오기 　1) man.name / 2) man["name"] ## ④ 연산자 ### 1) 산술연산자 '+' : 덧셈 '-' : 뺄셈 '*' : 곱셈 '/' : 나눗셈 '%' : 나머지 ** ++a; 는 a = a+1; 과 같은 코드 / --a;는 a-1;과 같은 코드 ++a 와 a++는 출력순서가 다름 ! -> ++a는 먼저 더한 후 출력 , a++는 출력 후 더하기
### 2) 관계연산자 (Relational operator) ** boolean 타입으로 동작 | 관계연산자 | 동작 | | -- | -- | | < | A보다 B가 더 큰 경우 참 | | > | A보다 B가 더 작은 경우 참 | | <= | A보다 B가 크거나 같은 경우 참 | | >= | A보다 B가 작거나 같은 경우 참 | | == | A와 B가 같은 경우 참 | | != | A와 B가 같지 않은 경우 참 |
### 3) 논리연산자 (Logical operator) #### - And(&&) 연산자 * 두 피연산자가 모두 True일때 True를 반환 |　　| True | False | | -- | -- | -- | | True | True | False | | False | False | False |
#### - Or(||) 연산자 * 두 피연산자 중 하나라도 True 이면 True를 반환 |　　| True | False | | -- | -- | -- | | True | True | True | | False | True | False |
#### - Not(!) 연산자 * 피연산자가 true인 경우 false를, false인 경우 true를 나타내는 단항연산자 ## ⑤ 함수 function 함수이름 (인자1, 인자2) { /* 실행할 코드 */ return 결과값; } ## ⑥ String ### - 이어붙이기 1) var str = "Hello" var str2 = "World" str.concat(str2) = "Hello World" str.concat(str2).concat("!"); = "Hello World!" 2) str + str2 = "Hello World" 3) "Hello" + "World" = Hello World 4) "Pi is" + 3.14 = Pi is 3.14 ### - 특정 위치의 문자열 알아내기 1) .charAt 함수 이용 첫 문자 : str.charAt(0) 마지막 문자 : str.charAt(str.length-1) 2) 대괄호([]) 사용 첫 문자 : str[0] 마지막 문자 : str[str.length-1] ### - 문자열의 연속된 일부분 구하기 1) .substring(pos1, pos2) : pos1 에서 pos2까지의 부분 문자열 반환 pos2 생략시 pos1에서부터 마지막 까지의 문자열 반환 2) .substr(pos, length) : pos에서 length길이 만큼의 부분 문자열 반환 length 생략시, pos에서 마지막까지의 문자열 반환 pos 가 음수인 경우, str.length - pos 로 동작 ## ⑧ 조건문 ### - if, else, else if 문 if(/*조건식*/){ /*참인경우 실행될 코드*/ } else if( /*조건식*/ ){ /*if 문의 조건이 거짓이고, 위의 조건식이 참인경우 실행될 코드*/ } /* 여러개의 else if... */ else if( /*조건식*/ ){ /*위의 if, else if문의 모든 조건이 거짓이고, 위의 조건식이 참인경우 실행될 코드*/ } else{ /*모든 if, else if 문이 모두 실행되지 않았을 때 실행될 코드*/ } ### - switch 문 switch( /*비교할 값*/ ){ case /*값1*/: /*비교할 값이 값1인 경우 실행될 코드*/ break; case /*값2*/: /*비교할 값이 값2인 경우 실행될 코드*/ break; /* ... 여러개의 case */ default: /*비교할 값이 위의 모든 값과 다른 경우 실행될 코드*/ break; } ** break구문을 만나면 switch-case 문의 마지막 중괄호 밖으로 빠져나옴. break를 사용하지 않으면, switch 문에서 빠져나오지않고, 다음 case에 해당하는 코드까지 실행 ## ⑨ 반복문 ### while, do while 문 - while : 조건이 만족하는 동안 반복실행될 코드를 계속 실행 while( /*조건식*/ ){ /* 반복 실행될 코드 */ } * countinue : 남은 반복 실행 될 코드 모두 skip, break : 반복문에서 즉시 탈출
- do while 문 : 구문을 무조건 한 번은 실행 한 후에 반복할 지 말지의 while문을 작성함 do{ /* 반복 실행 될 코드*/ } while ( /* 조건식 */ ) ## ⑩ for 문 for ( 초기화 구문, 조건식, 업데이트 할 구문) {} * 조건식이 참이 아닐경우 바로 종료 * for문에서 continue; 구문을 만나면 ? --> 업데이트 구문으로 갔다가 조건식으로 감 ## ⑪ 변수의 scope - 변수의 scope는 function의 scope를 따른다. -> 객체(변수)는 선언 된 함수 안에서만 접근이 가능하다. ## ⑫ closure 함수 - .... 무슨 말인지 잘 모르겠다 ,,,,,,, ## 에러 1) SyntaxError : 잘못된 문법에서 발생하는 에러 ## 그 외 - 문자열 표현 쌍따옴표("")와 따옴표(' ') 모두 사용 가능 - 쌍따옴표 안에 따옴표를 사용하고싶다면 앞에 $역슬래쉬)를 사용하면 됨 - 문자열 안에 역슬래쉬를 사용하고싶다면 역슬래쉬 두번 입력 (\$ - 개행문자 > \n : 줄바꿈 / \t : 탭 - undefined, null : 값이 없다 - [콜백함수](https://inpa.tistory.com/entry/JS-%F0%9F%93%9A-%EC%9E%90%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%BD%9C%EB%B0%B1-%ED%95%A8%EC%88%98#%EC%BD%9C%EB%B0%B1%ED%95%A8%EC%88%98_%EC%82%AC%EC%9A%A9_%EC%9B%90%EC%B9%99)