study diary

1. 스코프란? - 스코프 scope(유효범위)는 자바스크립트를 포함한 모든 프로그래밍 언어의 기본적이며 중요한 개념 - 함수의 매개변수는 함수 몸체 내부에서만 참조할 수 있고 함수 몸체 외부에서는 참조할 수 없다. 이것이 매개변수를 참조할 수 있는 유효범위, 즉 매개변수의 스코프가 함수 몸체 내부로 한정되기 때문이다. * 스코프 : 식별자가 유효한 범위 - 모든 식별자(변수 이름, 함수 이름, 클래스 이름 등)는 자신이 선언된 위치에 의해 다른 코드가 식별자 자신을 참조할 수 있는 유효 범위가 결정된다. 이를 스코프라고 한다. var x='global'; function foo(){ var x = 'local'; console.log(x); } foo();// local console.log(x); /..

1. 함수란? - 매개변수 : 함수 내부로 입력을 전달받는 변수 - 인수 : 입력 - 반환값 : 출력 2. 함수를 사용하는 이유 - 코드의 재사용 측면에서 유용 - 유지보수의 편의성을 높이고 실수를 줄여 코드의 신뢰성 높임 3. 함수 리터럴 - 자바스크립트의 함수는 객체 타입의 값이다. - 일반 객체는 호출할 수 없지만 함수는 호출할 수 있다. 4. 함수 정의 - 함수 선언문 - 함수 표현식 - Function 생성자 함수 - 화살표 함수(ES6) 1) 함수 생성 시점과 함수 호이스팅 //함수 참조 console.dir(add); // f add(x,y) console.dir(sub); // undefined // 함수 호출 console.log(add(2,5)); // 7 console.log(sub(..

- 자바스크립트가 제공하는 7가지 데이터 타입(숫자, 문자열, 불리언, null, undefined, 심벌, 객체 타입)은 크게 원시 타입과 객체 타입으로 구분한다. - 원시 타입 vs 객체 타입? 원시 타입의 값, 즉 원시 값은 변경 불가능한 값이다. 객체(참조) 타입의 값은 변경 가능한 값이다. 원시 값을 변수에 할당하면 변수(확보된 메모리 공간)에는 실제 값이 저장된다. 이에 비해 객체를 변수에 할당하면 변수(확보된 메모리 공간)에는 참조 값이 저장된다. 원시 값을 갖는 변수를 다른 변수에 할당하면 원본의 원시 값이 복사되어 전달된다.(값에 의한 전달), 객체를 가리키는 변수를 다른 변수에 할당하면 원본의 참조 값이 복사되어 전달된다(참조에 의한 전달) 1. 원시값 1) 변경 불가능한 값 - 원시 ..

1. 객체란 - 자바스크립트는 객체 기반의 프로그래밍 언어이며, 자바스크립트를 구성하는 거의 "모든 것"이 객체이다. - 원시 값을 제외한 나머지 값(함수, 배열, 정규 표현식 등)은 모두 객체이다. - 원시 타입은 단 하나의 값만 나타내지만 객체 타입은 다양한 타입의 값(원시 값 또는 다른 객체)를 하나의 단위로 구성한 복합적인 자료구조이다. 또한, 원시 타입의 값, 즉 원시 값은 변경 불가능한 값이지만 객체 타입의 값, 즉 객체는 변경 가능한 값이다. - 프로퍼티의 값이 함수일 경우 일반함수와 구분하기 위해 메서드라 부른다. * 프로퍼티와 메서드의 역할 프로퍼티 : 객체의 상태를 나타내는 값(data) 메서드 : 프로퍼티(상태 데이터)를 참조하고 조작할 수 있는 동작(behavior) 2. 객체 리터..

1. 타입 변환이란? - 자바스크립트의 모든 값은 타입이 있다. 값의 타입은 개발자의 의도에 따라 다른 타입으로 변환될 수 있다. - 개발자가 의도적으로 값의 타입을 변환하는 것을 명시적 타입 변환 또는 타입 캐스팅이라한다. - 개발자의 의도와는 상관없이 표현식을 평가하는 도중에 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되기도 한다. 이를 암묵적 타입 변환 또는 타입 강제 변환이라 한다. var x=10; //암묵적 타입 변환 //문자열 연결 연산자는 숫자 타입 x의 값을 바탕으로 새로운 문자열을 생성한다. var str = x+''; console.log(typeof str, str); //string 10 //x변수의 값이 변경된 것은 아니다. console.log(typeof x,x); ..

- 제어문은 조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문)할 때 사용한다. 일반적으로 코드는 위에서 아래 방향으로 순차적으로 실행된다. 제어문을 사용하면 코드의 실행 흐름을 인위적으로 제어할 수 있다. 하지만 코드의 실행 순서가 변경된다는 것은 단순히 위에서 아래로 순차적으로 진행하는 직관적인 코드의 흐름을 혼라느럽게 만든다. 나중에 살펴볼 forEach, map, filter, reduce 같은 고차 함수를 사용한 함수형 프로그래밍 기법에서는 제어문의 사용을 억제하여 복합성을 해결하려고 노력한다. 1. 블록문 - 블록문은 0개 이상의 문을 중괄호로 묶은 것으로, 코드 블록 또는 블록이라고 부르기도 한다. - 자바스크립트는 블록문을 하나의 실행 단위로 취급한다. 블록문은 단독으로 사용할..

1. 산술 연산자 - 산술 연산자는 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만든다. 산술 연산이 불가능한 경우 NaN을 반환한다. 산술 연산자는 피연산자의 개수에 다라 이향 산술 연산자와 단항 산술 연산자로 구분할 수 있다. 1) 이항 산술 연산자 - 이항 산술 연산자는 2개의 피연산자를 산술 연산하여 숫자 값을 만든다. - 모든 이항 산술 연산자는 피연산자의 값을 변경하는 부수 효과가 없다. 다시 말해, 어떤 산술 연산을 해도 피연산자의 값이 바뀌는 경우는 없고 언제나 새로운 값을 만들 뿐이다. - + 덧셈, - 뺄셈, * 곱셈, / 나눗셈, % 나머지 2) 단항 산술 연산자 - 단항 산술 연산자는 1개의 피연산자를 산술 연산하여 숫자 값을 만든다. 단항 산술 연산자 의미 부수 효과..

1. 숫자 타입 - 모든 수를 실수로 처리하며, 정수만 표현하기 위한 데이터 타입 별도로 존재 X - 숫자 타입은 추가적으로 3가지 특별한 값도 표현 가능하다. Infinity : 양의 무한대 -Infinity : 음의 무한대 NaN : 산술 연산 불가 (not-a-number) 2. 문자열 타입 - 텍스트 데이터를 나타내는 데 사용한다. - 작은따옴표 ( ' ' ), 큰따옴표 ( " " ), 백택( ` `)으로 텍스트를 감싼다. 3. 템플릿 리터럴 - ES6부터 템플릿 리터럴이라고 하는 새로운 문자열 표기법이 도입되었다. 템플릿 리터럴은 멀티라인 문자열, 표현식 삽입, 태그드 템플릿 등 편리한 문자열 처리 기능을 제공한다. 템플릿 리터럴은 런타입에 일반 문자열로 변환되어 처리된다. - 템플릿 리터럴은 ..

1. 값 값 value은 식(표현식expression)이 평가evaluate되어 생성된 결과를 말한다. 평가란 식을 해석해서 값을 생성하거나 참조하는 것을 의미한다. [예제] //10+20은 평가되어 숫자 값 30을 생성한다. 10+20; // 30 변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름이다. 따라서 변수에 할당되는 것은 값이다. [예제] //변수에는 10+20이 평가되어 생성된 숫자 값 30이 할당된다. var sum=10+20; - sum 변수에 할당되는 것은 10+20이 아니라 10+20이 평가된 결과인 숫자 값 30이다. 즉 sum 메모리 공간에 저장된 것은 값 30이다. 따라서 10+20은 할당 이전에 평가되어 값을 생성해야한다..

메소드 역할 text() 선택된 HTML 요소의 텍스트 내용을 가져오거나 설정한다. html() 선택된 HTML 요소에서 HTMl 태그를 포함한 내용을 가져오거나 설정한다. val() 선택된 HTML 폼 요소의 속성 값을 가져오거나 설정한다. attr() 선택된 HTML 요소의 속성 값을 가져오거나 설정한다. 1) text() / html() / val() 메소드 - text() : 요소의 텍스트만 가져옴 - html() : HTML 태그도 같이 가져 옴 - val() : input 태그에 입력된 값을 가져 옴 2) attr() 메소드 - HTMl 요소의 속성에 설정되어 있는 속성 값을 가져오는 데 사용된다. - 해당코드의 경우 클래스 img에 있는 src 속성을 attr ..