본문 바로가기

Javascript

[자바스크립트 비기너] Boolean 오브젝트, 자바스크립트 특징, Object 오브젝트(ES5 기준), JSON 오브젝트, Date 오브젝트, Math 오브젝트 Boolean 오브젝트 빌트인 오브젝트 true와 false 처리 값이 있으면 true로 인식 false 인식 기준 undefined, null, NaN 빈 문자열, 숫자 타입의 0 숫자 값 변환 기준 true를 1로, false를 0으로 변환 new Boolean() Boolean 인스턴스 생성 파라미터 값을 true 또는 false로 변환하여 프리미티브에 설정 //value의 모든 값이 false로 변환되며 생성한 Boolean 인스턴스의 프리미티브 값으로 설정 var value = [undefined, null, NaN, 0, ""]; for (var k = 0; k < value.length; k++){ var obj = new Boolean(value[k]); log(obj + 1); }; //.. 더보기
[자바스크립트 비기너] Array 오브젝트 ES3/ES5 기준 Array 오브젝트 (ES3 기준) Array 오브젝트 개요 빌트인 오브젝트 Array 형태 [123, "ABC", "가나다"] 배열 엘리먼트 123, "ABC" 각각을 엘리먼트 또는 요소라고 부름 2의 32승 (4,294,967,296) - 1개 인덱스 엘리먼트 위치를 인덱스라고 부름 왼쪽부터 0번 인덱스, 1번 인덱스 배열 특징 엘리먼트 작성이 순서를 갖고 있음 배열 전체를 작성한 순서로 읽거나 인덱스로 값을 추출할 수 있음 배열 생성 방법 new Array()로 생성 var book = new Array(); Array()로 생성 var book = Array(); 대괄호로 생성 var book = []; 일반적으로 이 형태를 사용 엘리먼트 작성 방법 var book = ["책1", '책2']; 대.. 더보기
[자바스크립트 비기너] Object 오브젝트, Function 오브젝트, Global 오브젝트 Object 오브젝트 오브젝트 구분 빌트인 오브젝트 네이티브 오브젝트 호스트 오브젝트 빌트인 오브젝트 사전에 만들어 놓은 오브젝트 빌트인 Number 오브젝트, 빌트인 String 오브젝트 네이티브 오브젝트 JS 스펙에서 정의한 오브젝트 빌트인 오브젝트 포함 JS 코드를 실행할 때 만드는 오브젝트 예: Argument 오브젝트 호스트 오브젝트 빌트인, 네이티브 오브젝트를 제외한 오브젝트 예: window, DOM 오브젝트 JS는 호스트 환경에서 브라우저의 모든 요소 기술을 연결하고 융합하며 이를 제어 /* querySelector()는 DOM 함수 * DOM에서 제공하는 오브젝트를 호스트 오브젝트라고 부름 * 마치 JS 함수처럼 DOM 함수를 사용 */ var node = document.querySel.. 더보기
[자바스크립트 비기너] Object, Built-in, Number Object, String Object Object Property {name: value} 형태 name에 property 이름/키를 작성 (따옴표 생략) value에 JS에서 지원하는 타입 작성 {a: 123, b: "ABC", c: true, d: {}} {book: function(){코드}} Object와 객체 구분 Property 추가, 변경 오브젝트에 프로퍼티 추가, 변경 var obj = {}; obj.abc = 123; obj 오브젝트에 프로퍼티 이름으로 abc가 없으면 abc:123이 추가, 있으면 프로퍼티 값이 123으로 변경 작성 방법 점(.)과 프로퍼티 이름 사용 대괄호 사용: obj["abc"] abc 변수 이름 작성: obj[abc] var book = {}; book.title = "JS책"; log(book); .. 더보기
[자바스크립트 비기너] 함수(Function) // 함수 구성 요소, 함수 이름 규칙과 관례 함수(function) - 특정 기능을 처리하는 자바스크립트 코드 묶음 함수 구성 요소 - function 키워드 - 함수 이름 - 파라미터(매개 변수, 인자, 아규먼트) // 작성은 선택 - 함수 Body(함수 코드, 소스 텍스트) : 중괄호{} 안에 작성한 코드 // 작성은 선택 함수 이름 규칙 - 첫 문자 : 영문자, $, 언더바(_) // 숫자, &, *, @, +는 사용 불가 - 함수 코드를 읽지 않더라도 함수 이름과 파라머티로 기능을 알 수 있도록 시맨틱을 부여하여 작명 함수 이름 관례 - 동사로 시작 - 두 개 이상의 단어를 사용할 때, 두 번째 단어부터 명사 사용. 명사의 첫 문자는 대문자 => CamelCase 형태 - 동사 + 명사 형태로 .. 더보기
[자바스크립트 비기너] 문장(Statement) // 문장, 화이트 스페이스, 세미콜론 자동 삽입, 블록 문장 - 형태 : ;(세미콜론) - 문장을 끝나게 하는 역할 화이트 스페이스(White Space) - 사람 눈에 보이지 않는 문자 - 가독성을 위한 것 - 문자마다 기능을 갖고 있음 - e.g. 스페이스, 엔터, 탭, NBSP, Line Feed, Carriage Return 등 세미콜론 자동 삽입 - 세미콜론은 문장 끝에 작성 - 세미콜론을 삽입하여 자동으로 문장이 끝나게 함 - JS엔진이 분석 및 삽입 블록 - 형태 : {문자 리스트opt} - 중괄호{ } - 실행 그룹 - 블록 안의 모든 문장 실행 - 문장 리스트 - { } 안의 모든 문장 - 문장 리스트 작성은 선택(option) - 강좌에서 option을 opt로 표기 - 블록 사용 권.. 더보기
[자바스크립트 비기너] 연산자(Operator) 할당 연산자 1. 단일 할당 연산자 - = 하나만 사용 - var result = 1 + 2; 2. 복합 할당 연산자 - = 앞에 연산자 작성 +=, -=, *=, /=, %= = >>>=, &=, ^=, |= 3. 먼저 = 앞을 연산한 후 할당 var point = 7; point += 3; 해석, 실행 순서 해석이란? - JS 코드를 기계어로 바꾸는 것. Compile - 엔진이 해석하고 실행 실행 순서 - = 왼쪽의 표현식 평가 - = 오른쪽의 표현식 평가, 왼쪽에서 오른쪽으로 평가 - = 오른쪽 표현식의 평가 결과를 왼쪽 표현식 평가 결과에 할당 산술 연산자 + 연산자 1. + 양쪽의 표현식을 평가 - 평가 결과를 더함 2. 평가 결과 연결 - 한 쪽이라도 숫자가 아니면 연결 - 연산자 Strin.. 더보기
[자바스크립트 비기너] 기본 문법 HTML 파일 작성 - 확장자 : html - 인코딩 : utf-8 HTML 파일에 JS 파일 작성 방법 1) or 의 에 js 파일 작성 2) defer 속성 작성 rendering 하다가 hello.js 만나면 서버에서 hello.js 가져와서 코드 실행하는데 그 코드에서 body의 element에 접근하면 아직 body를 렌더링하지 않았기 때문에 에러 발생. 하지만 defer 쓰면 body까지 rendering한 후에 hello.js 실행하므로 에러 발생하지 않음 3) HTML과 JS 분리 >Statement - JS 코드 실행 단위 - 세미콜론(;)까지 하나의 문장 - 문장 시작 위치는 제약 없지만 일반적으로 2칸, 4칸 들여쓰기 >Variables : 값을 저장하는 영억 "시맨틱(Semantic.. 더보기