2024.10.01 (Day 18) - JavaScript OOP / 클로저(Closure)
·
BootCamp Review
클로저란? 함수와 함수가 선언되었을 때의 렉시컬 환경(Lexical environment) 의 조합을 의미한다.클로저는 자바스크립트에서 중요 개념이며 자바스크립트 뿐만 아니라함수를 객체로 사용하는 대부분의 소프트웨어 언어에서 제공되는 개념이다. 클로저는 자바스크립트에서 함수를 이용하기 위해서 자동으로 제공되는 개념이며클로저를 위해 개발자가 어떤 코드적인 프로그램을 작성해야 하는 것은 아니고클로저 개념을 접하면 실행 컨텍스트(Execution Context) 개념과 렉시컬 환경을 이해가 선행되어야 한다. ▼ 실행 컨텍스트 • 실행 컨텍스트란 함수의 실행 환경이며 함수가 실행되기 위한 정보를 가지는 객체이다.함수가 호출되어 실행되려면 함수에 전달된 매개변수 값, 함수내에 선언된 로컬 변수, 로컬 함수등을 이..
(31) JavaScript - 배열(Array) / for...of 반복문
·
JS
index가 있는 배열의 특징과 length 프로퍼티를 잘 활용하면 단순히 for문으로도 배열의 길이만큼 반복을 하면서 각 요소들을 다룰 수 있기는하지만for of 반복문으로 일반적인 for문보다 훨씬 더 간결하게 배열을 다룰 수있다. let members = ['행섭', '양천', '찌듕', '힝카인', '데셔', '스기따라','넌적혈구'] //단순 for문으로 작성 할 때 for(let i = 0; i   for...of 반복문객체를 반복할 때 사용했던 for...in문의 구조와 비슷하게 생겼는데for...in문은 객체가 들어가고 변수의 프로퍼티 네임이 할당되어있지만 of문은 배열의 요소가 할당된다. ▼ //for...in for (변수 in 객체) { 동작부분 ..
2024.10.01 (Day 18) - JavaScript OOP / 클래스(class)
·
BootCamp Review
선언 및 생성• 객체의 모형을 선언하고 그 모형을 이용해 객체를 만드는 방법은 우리가 이미 살펴본 생성자 함수를 이용하는 방법이 있고 클래스를 이용하는 방법이 있다.생성자 함수를 이용하는 방법은 자바스크립트 초기부터 제공하던 전통적인 방법이며 클래스를 이용하는 방법은 ECMA2015부터 추가된 방법이며 ECMA2015에서 대부분의 소프트웨어 언어에서 객체지향을 위해 제공하는 클래스 방식을 지원하기 시작한 것이다. • 동일한 멤버로 구성되는 객체를 여러 개 만들기 위해서는우선 객체의 모형을 선언해야 하는데 이러한 모형이 클래스 이다.• 클래스는 class 라는 예약어로 선언되며 이 클래스내에 객체의 멤버인 프로퍼티와 함수를 선언하고클래스를 바탕으로 객체를 생성하기 위해서는 new 연산자를 이용한다.//클래..
(30) JavaScript - 배열 메소드 (Array Method) [shift, pop, unshift, push Method]
·
JS
splice 보다 조금 더 간결하게 코드를 작성할 수 있는 메소드가 여러가지 존재한다 shift 메소드shift 메소드는 파라미터가 없기 때문에 그냥 members.shift 라고 메소드를 호출한다. let members = ['행섭', '양천', '찌듕', '힝카인', '데셔', '스기따라','넌적혈구'] console.log(members); //splice보다 간결한 메소드 // 배열의 첫 요소를 삭제 - shift members.shift(); console.log(members);▲ shift 메소드를 사용해서 배열의 가장 첫 요소를 삭제하고 나머지 요소들은 앞으로 밀어줌에 따라제일 앞에 있는 '행섭' 요소가 삭제되고 나머지 요소들이 앞으로 밀림과 동시에 leng..
(29) JavaScript - 배열 메소드 (Array Method) [splice 메소드]
·
JS
배열을 좀 더 안전하고 효과적으로 다루기 위해서는 배열의 메소드를 활용해야한다. let members = ['행섭', '양천', '찌듕', '힝카인', '데셔', '스기따라','넌적혈구'] // 3. array 요소 삭제 console.log(members); delete members[4]; //데셔 값이 삭제 되었으나 empty로 남아있음. console.log(members); 이전 글에 delete 연산자로 배열의 요소를 삭제하려고 했지만 완벽하게 지워지지 않았다.배열의 요소를 삭제할 때 가장 많이 사용되는 메소드는 'splice' 라는 메소드이다. splice let members = ['행섭', '양천', '찌듕', '힝카인', '데셔', '스기따라','..
(28) JavaScript - 배열 (Array)의 기본구조
·
JS
여기 필자가 좋아하는 음식을 1등부터 4등까지 나열한 객체를 만들어 봤다. let favoriteFood = { '1st': '야채곱창', '2nd': '냉면', '3rd': '김치찌개', '4th': '갈비' } 그런데 이런 경우에는 프로퍼티 네임보다는 값들의 순서가 좀 더 중요한 상황이기 때문에프로퍼티 네임은 사용하지 않고 값들의 순서만 유지해도 될 것이다.이럴 때는 객체보다 배열(Array)를 활용하는 것이 좀 더 효율적이다. 배열(Array) let favoriteFoodList = [ //배열 생성 '야채곱창', '냉면', '김치찌개', '갈비' ]▲ 배열은 중괄호 대신 대괄..
(27) JavaScript - 객체 / Date 객체
·
JS
지금까지 많이 사용했던 console.log 함수의 콘솔 객체처럼자바스크립트가 미리 가지고 있는 객체를 '내장 객체 (Standard built-in objects)' 라고 부른다.자바스크립트는 거의 모든 것이 객체로 이루어져 있기 때문에 특별한 기능별로 다양항 내장 객체들이 존재하는데,그 중 하나가 '날짜(Date)' 객체 이다. 날짜 (Date) 객체자바스크립트에서 날짜는 'Date' 객체로 다루며 초기 구성은 ' let 변수 = new Date();' 로 이루어져있다. //Date let myDate = new Date(); console.log(myDate);▲ myDate라는 변수를 선언한 다음에 new라는 키워드와 함께 Date 하고 함수처럼 소괄호를 열고 닫아준다. ※ Dat..
2024.09.26-30 (Day 15,16,17) - JavaScript OOP / 다양한 OOP 기법
·
BootCamp Review
typeof, instanceof• typeof 연산자는 타입을 확인하기 위한 연산자이다. • instanceof 는 객체의 타입이 특정 타입인지를 판단하기 위한 연산자이며instanceof 왼쪽에 객체를, 오른쪽에 타입을 명시해서 왼쪽 객체의 타입이오른쪽에 명시한 타입인지를 판단하는 연산자이고 연산의 최종 결과는 true/false 이다.instanceof 는 생성자를 가지고 판단하는 연산자이기도 한다. ▶ 다른 함수의 프로토타입을 그대로 자신의 프로토타입으로 지정하는 경우의 instanceof  ▶ 상위 객체를 생성해서 하위 프로토타입으로 지정하는 경우의 instanceof "use strict"function User(){}let user1 = new User()//typeofconsole.log(..
(26) JavaScript - 객체 / for...in 반복문
·
JS
for...in 반복문은 객체를 다루는 for문이며 객체 안에 있는 프로퍼티들들 가지고반복적인 동작을 수행할 때 사용한다.객체의 프로퍼티 네임을 가져오는 반복문이기 때문에 일반적은 for문으로 대체할 수 없는 특별한 반복문이라고 보면 된다. for...in 반복문 for (변수 in 객체) { 동작부분 } ▲ 기본 구조부터 살펴보면 일반적인 for문과 비슷하지만 소괄호 내부가 조금 다르다.소괄호 내부에서 특정한 변수를 만들고 in이라는 키워드 다음에 반복할 객체를 넣어주면  그 객체에 프로퍼티 네임이 변수에 할당되고 객체에 프로퍼티 개수만큼 반복 동작을 하게 된다.  let exp = { name : '섭이', Year : 2024, ar..
(25) JavaScript - 객체 / 객체와 메소드
·
JS
연관된 여러 값을 하나로 묶고 싶을 때 객체를 활용했던 것처럼연관성이 있는 여러 함수들을 하나로 묶고 싶은 경우도 있을텐데이럴 때에도 객체를 사용하면 된다. 메소드 (Method)객체의 프로퍼티는 어떤 자료형이든 저장할 수가 있기 때문에프로퍼티 값으로 함수를 넣어 주면 된다.이런 함수를 객체의 메소드라고 부른다. //메소드(Method) let greetings = { sayHello: function () { console.log('안녕하세요'); }, sayHi: function () { console.log('안녕'); }, sayBye: function () { co..