프론트엔드/Java Script (42) 썸네일형 리스트형 JavaScript Sec01_10 배열 Array (배열) 객체, 함수와 더불어 Non-Primitive Data Type이다. 순서가 있는 요소들의 집합 즉, 여러 개의 항목이 들어있는 리스트 요소들의 자료형이 어떤 것이든 (숫자형, 문자형, 배열, 함수, 객체, boolean, undefined 등등) 상관없다. 배열의 생성 생성자 이용 Array 라는 생성자를 호출하여 변수 arr에 담는다. 배열 리터럴 이용 대괄호 [] 를 사용하여 배열을 만들어 변수 arr에 담는다. 생성자보다 배열 리터럴을 더 자주 사용 Index ; 배열 요소 접근 인덱스는 0부터 시작하여 배열의 길이 -1 에서 끝난다. 다음과 같이 각각의 요소에 접근할 수 있다. (다른 프로그래밍 언어와 비슷) push : 배열에 요소를 추가하는 함수 arr.push( // ).. JavaScript Sec01_9 객체 Non-Primitive Type (비원시타입)으로, 한 번에 여러 개의 값을 가질 수 있다. new를 이용한 객체 생성 let person = new Object(); new 라는 키워드를 이용해 person이라는 Object 객체를 생성하였다. 객체 리터럴 방식을 이용한 객체 생성 (자주 사용) let person = { 객체가 갖고 있는 데이터들 }; 중괄호를 이용해 person이라는 객체를 생성하였다. 중괄호에 들어가는 객체의 데이터들은 key : "value" 형태로 저장된다. 객체 프로퍼티 객체가 갖고 있는 데이터 즉, key : “value” 쌍을 의미한다. 출력 시 ⇒ 프로퍼티의 value 값에는 어떤 자료형이 오든 상관없다. 출력 시 ⇒ key는 문자열로만 이루어져야 하지만 큰따옴표 “ .. JavaScript Sec01_8 콜백함수 함수의 매개변수로 ‘함수’를 넘겨준 것을 의미한다. 함수 표현식을 이용하여 함수의 파라미터로 함수를 사용함 cry () 라는 함수를 변수 badCallback에 값으로서 집어넣는다. (함수 표현식) badCallback() 매개변수를 호출하면 cry () 가 실행된다. JavaScript Sec01_7 함수표현식 & 화살표함수 함수도 자바스크립트 내에서는 자료형 (값의 분류) 이므로 값으로 다뤄서 변수나 상수에 대입하여 사용할 수 있다. 함수 선언식 function 함수명 () { 구현부 } ; 함수 표현식 let 변수명 = function () { 구현부 }; 함수를 값으로 다뤄 변수에 대입할 때는 함수의 이름을 선언하지 않아도 된다. 변수명이 함수의 이름이 된다. 호이스팅 호이스팅 대상의 함수들은 프로그램 실행 전에 코드 최상단에 끌어 올려진다고 생각하면 된다. 함수 선언식은 호이스팅이 일어나지만 함수 표현식은 호이스팅이 일어나지 않아 함수를 담은 변수를 직접적으로 선언하기 전에는 해당 함수에 접근할 수 없다. ⇒ 함수 표현식은 호이스팅이 일어나지 않아 에러가 나는 것을 확인할 수 있다. 화살표 함수 화살표 함수 : 함수 .. JavaScript Sec01_6 함수 function function 함수명 () { 구현 } : function이라는 키워드를 통해 함수를 만들 수 있다. 소괄호 ( ) 에는 매개변수를 작성한다. return을 이용해 함수를 호출한 곳에 값을 반환할 수 있다. 지역 변수 : 함수 내에서 선언한 변수로, 함수의 바깥에서는 접근할 수 없다. 전역 변수 : 함수 바깥에서 선언한 변수로, 함수 내부에서도 접근이 가능하다. JavaScript Sec01_5 조건문 if / else if / else 문 자바와 동일 swtich case 문 자바와 동일 JavaScript Sec01_4 연산자 산술 연산자 = + - / % 연결 연산자 문자열과 문자열을 + 로 연결했을 때 위와 같이 12로 출력이 된다 문자열과 숫자를 + 로 연결했을 때도 마찬가지로 숫자가 문자형으로 자동 변환되어 (암시적 형 변환) 12가 출력된다. 복합 연산자 += -= /= %= 증감 연산자 후위 증감 연산자 a++ : 대입 먼저 하고 +1을 한다. 전위 증감 연산자 ++a : 연산 먼저 하고 대입한다. 논리 연산자 ! (not) boolean type (true/false) 값을 반대로 출력한다 && (and) 양 옆의 피연산자 둘 다 참이면 참 둘 중 하나라도 거짓이면 거짓 || (or) 양 옆의 피연산자 둘 다 거짓이면 거짓 둘 중 하나라도 참이면 참 비교 연산자 == 값만 비교 === 값과 타입 모두 비교 < , .. JavaScript Sec01_3 자료형과 형 변환 Primitive Type (원시 타입) / 내장형 타입 / 기본형 타입 값이 중간에 바뀔 수는 있지만, 하나의 순간에는 하나의 값만 가질 수 있다. 하나의 고정된 저장 공간 이용 Non - Primitive Type (비원시 타입) 한 번에 여러 개의 값을 가질 수 있다. 여러 개의 고정되지 않은 동적 공간 사용 let number = 12; //원시타입 let array = [1,2,3,4]; //비원시타입 Primitive Type (원시 타입) 자료형 숫자형 문자형 큰따옴표, 작은따옴표 상관없이 사용 가능 따옴표 뿐 아니라 백틱 (` `)을 이용해서 문자형을 표현할 수도 있음 백틱을 이용하는 이유 ? 템플릿 리터럴을 이용할 수 있음 템플릿 리터럴 : ${ 변수명 } => 문자열 안에 변수의 값을 .. 이전 1 2 3 4 5 6 다음
