[JavaScript] ④ 자바스크립트 객체란 무엇일까?
·
개발/JavaScript
자바스크립트는 객체 기반 언어다. 자바스크립트는 객체 기반 프로그래밍 언어이며, 원시 값을 제외한 모든 값은 객체다. 즉, 함수, 배열, 정규 표현식 등이 모두 객체다. 객체는 프로퍼티(property)로 구성되며, 프로퍼티는 키(key)와 값(value)로 구성된다. 프로퍼티의 값이 함수일 경우 이를 메소드(method)라 한다. 객체의 의해 비유를 통해 우선 객체의 개념을 이해해보자. 우리는 실생활에서 객체의 예시를 살펴볼 수 있다. 집에서 키우는 고양이, 사용 중인 키보드, 스마트폰 등이 모두 객체다. 이러한 객체들은 상태(state)를 갖거나 행동(behavior)을 한다. 예를 들어, 고양이의 경우 이름, 눈동자 색, 종, 꼬리 모양 등의 상태와 더불어 꾹꾹이, 뛰어 오르기, 잠자기 등의 행동을..
자바스크립트 do while 반복문
·
개발/JavaScript
자바스크립트 반복문: do while do while 반복문은 while 반복문과 무척 유사하다. 그러나 차이점이 있다면 조건을 만족하든 하지않든, 블록 안의 코드가 한 번은 실행된다는 것이다. 즉, 조건을 확인하기 전 블록 코드를 실행하며, 해당 코드가 false가 되기 전까지 while 반복문을 실행한다.
자바스크립트 할당 연산자
·
개발/JavaScript
할당 연산자(assignment operator)란 오른쪽 피연산자의 값을 왼쪽 피연산자에 할당하는 것이다. 이름 단축 연산자 의미 할당 x = y x = y 덧셈 할당 x += y x = x + y 뺄셈 할당 x -= y x = x - y 곱셈 할당 x *= y x = x * y 나눗셈 할당 x /= y x = x / y 나머지 연산 할당 x %= y x = x % y 지수 연산 할당 x **= y x = x ** y 왼쪽 시프트 할당 x > y 부호없는 오른쪽 시프트 할당 x >>>= y x = x >>> y 비트 AND 할당 x &= y x = x & y 비트 XOR 할당 x ^= y x = x ^ y 비트 OR 할당 x |= y x = x | y
자바스크립트 배열 속성 및 메소드 정리
·
개발/JavaScript
배열(Array)은 객체(Object)와 다르게 순서가 존재하며, 서로 다른 데이터 유형이 자유롭게 담길 수 있다. 즉, 배열에는 원시 데이터 유형과 객체 데이터 유형이 모두 담길 수 있다(배열 안에 객체가 담긴다든지, 배열 안에 또 다른 배열이나 함수 등이 모두 담길 수 있음). 다음은 w3schools에서 제공하는 자바스크립트 배열 속성과 메소드 테이블을 번역한 것이다. 자바스크립트 배열 속성 속성(Property) 설명 constructor 배열 객체의 프로토타입 함수 리턴 length 배열의 길이를 지정하거나 배열의 길이를 리턴 prototype 배열 객체에 속성 또는 메소드를 추가 자바스크립트 배열 메소드 메소드(Method) 설명 concat() 두 개 혹은 그 이상의 배열을 결합하고 결합된 ..
자바스크립트 화살표 함수 사용 방법 정리
·
개발/JavaScript
자바스크립트의 화살표 함수는 ES6에서 도입되었으며, function 키워드 대신 =>(arrow notation 또는 fat arrow라 함)를 사용한다. 다음 예시에서 보듯, 화살표 함수 생성은 아규먼트[파라미터] 다음에 =>를 사용하고 함수의 바디를 적는다. 함수가 하나의 아규먼트를 취할 경우 괄호를 생략할 수 있으며, 함수 바디가 하나의 구문만을 포함하는 경우 중괄호와 return구문을 생략할 수 있다. 또한 화살표 함수는 언제나 익명이며, 따라서 이를 변수에 할당할 수는 있으나, function 키워드처럼 이름을 만들 수는 없다. 다음은 에서 가져온 화살표 함수 예시다. const f1 = function() { return "hello!"; } // 또는 const f1 = () => "hel..
자바스크립트 표현식과 연산자 개념
·
개발/JavaScript
자바스크립트에는 표현식(expression)과 표현식이 아닌 것(non-expression)이 존재한다. 이 둘을 구분하는 것이 중요한데, 표현식은 값을 산출하기 때문에 이를 변수, 상수, 속성에 담아 다른 표현식과 연결할 수 있는 반면, 표현식이 아닌 경우에는 동일한 방식으로 연견할 수 없기 때문이다. 자바스크립트 표현식 자바스크립트에서 표현식은 하나의 값을 산출해 내는 것이다. let x; x = 3 * 5; // 간단한 표현식의 예 자바스크립트 연산자 다음으로 연산자에 대해 살펴보자. 연산자는 +, -, /, *, % 등처럼 특정한 연산을 수행해 값을 도출해 내도록 하는 것이다. 이러한 연산자의 연산 순서는 보통의 사칙 연산과 같지만, 자바스크립트에는 사칙 연산 이외에도 많은 연산자가 존재한다. 실..
[JavaScript] ⑤ 자바스크립트 함수란?
·
개발/JavaScript
자바스크립트에서 함수란 무엇일까? 함수란 입력을 받고 입력(input)을 받아 출력(output)을 내보내는 일종의 작은 프로그램을 의미한다. 예시를 살펴보자. 함수란 우리가 고등학교 수학 교과서에서 본 것처럼 f(x) = x + 1과 같은 구조를 취한다. 이는 함수(f) 안에 x값을 넣으면 x+1 값이 출력되는 일종의 연산을 의미한다. function f(x) { return x = x + 1; } f(2); // 3 위 예에서 볼 수 있듯 함수는 코드 블록 내의 문으로 구성된다. f()라는 함수는 아규먼트 x를 입력값으로 받는다. 입력값이 전달되면 여기에 1을 더해 이를 반환하게 된다. 따라서 f(2)를 실행시킬 경우 3이라는 값을 얻게 된다. 자바스크립트에서 함수 선언하는 방법 자바스크립트에서 함수..
[JavaScript] ③ 자바스크립트 데이터 타입
·
개발/JavaScript
자바스크립트의 모든 값은 데이터 타입을 갖는다. 데이터 타입을 구분하는 것은 중요한데 이를 통해 메모리 크기 공간이 다르게 할당되기 때문이다. 데이터 유형은 크게 원시 타입(Primiive Type)과 객체 타입(Object Type)으로 구분된다. 이러한 데이터 유형은 값 앞에 typeof 연산자를 사용하여 직접 확인해볼 수 있다. 원시 데이터 유형 Number: 일반적인 숫자(+Infinity, -Infinity, NaN(Not a Number)가 포함됨) String: 문자 데이터로 따옴표 "" 또는 홑따옴표 ''로 감싸 표시 Boolean: true 또는 false Null: null은 null 값을 가짐 Undefined: 값이 할당되지 않은 변수는 undefined를 값으로 가짐 Symbol:..