본문 바로가기

전체 글43

12. 객체지향 프로그래밍으로 코드 구현하기 (생성자함수, 상속 예시) 안녕하세요. 좋아요요정입니다. 스터디를 진행하며 객체가 {키:값}으로 이루어진 프로퍼티 뿐만 아니라 객체 프로퍼티의 상태를 정의할 수 있는 데이터 프로퍼티, 접근할 때(get, set)의 상태를 정의할 수 있는 접근자 프로퍼티를 가지고, 메소드도 사용할 수 있는 것을 함께 배웠습니다. 그리고 이전 생성자함수편을 통해 함수도 사실 객체라는 사실을 확인했습니다. 오늘은 자바스크립트의 값이 있는 원시값은 객체의 특징을 사용할 수 있는 이유와 객제지향 프로그래밍이 무엇인지에 대해 알아보겠습니다. 자바스크립트의 값이 있는 원시값은 객체의 특징을 사용할 수 있습니다. 처음 자바스크립트를 배울 때 자바스크립트의 데이터타입은 원시값과 객체로 나뉘어진다고 배웠습니다. 원시값이란 객체가 아니면서 메서드도 가지지 않는 데이.. Study-Note/JavaScript 2022. 1. 15.
11. 자바스크립트의 함수는 일급 '객체'이다. 안녕하세요. 좋아요요정입니다. const 변수명 = function(매개변수 목록) { 코드 실행부 } 함수의 선언 방식 중 변수명에 무명의 함수리터럴, 익명 함수를 할당해 선언하고, 변수명으로 함수를 호출할 수 있는 함수 표현식 기억하시나요? 이렇게 함수를 변수에 할당할 수 있는 이유가 자바스크립트의 함수는 일급 객체이기 때문이라고 언급을 했었습니다. 일급 객체 먼저 일급 객체란 무엇일까요? 쉽게 표현하면 변수가 사용될 수 있는 자리에 객체가 사용될 수 있으면 일급 객체입니다. 일급 객체는 다음과 같은 조건 4가지를 만족하면 일급 객체라고 뜻합니다. 예시와 함께 보겠습니다. 1. 무명의 리터럴로 생성할 수 있다. const increasePoint = function (num) { return num .. Study-Note/JavaScript 2022. 1. 13.
10. 생성자 함수로 객체 생성의 장점과 생성 방법(new, constructor) 안녕하세요. 좋아요요정입니다! 이전 객체편에서 객체 리터럴 {}을 활용하여 쉽고 빠르게 객체 인스턴스를 생성하는 방법을 살펴보았습니다. 이번엔 자바스크립트에서 객체를 생성하는 방법 중 하나인 생성자 함수를 살펴보겠습니다. 생성자 함수 자바스크립트의 함수는 객체를 생성하기 위해서도 사용할 수 있습니다. 생성자 함수는 생성자 함수의 타입에 맞는 동일한 프로퍼티를 가진 여러개의 객체 인스턴스를 생성할 때 사용할 수 있습니다. 객체 인스턴스는 객체 모양의 데이터 구조로 실제 저장공간에 할당된 실체를 뜻합니다. 먼저, 생성자 함수가 필요한 경우로는 어떤 경우가 있을지 예를 들어보겠습니다. 여기 동물병원에서 진료받은 동물들의 정보를 기록하는 배열이 있습니다. 동물의 개인코드와 이름, 나이 그리고 해가 지나면 나이를.. Study-Note/JavaScript 2022. 1. 12.
09. 객체의 프로퍼티의 상태 정의, Get,Set을 통해 속성 접근 관리하기 안녕하세요 좋아요요정입니다. 이번 게시글에서는 자바스크립트의 객체에 대해 더 깊게 이해해보겠습니다. 객체의 프로퍼티는 속성(Properties)로써 Key와 value값을 한 쌍의로 정의한 것을 뜻했습니다. 이 프로퍼티에 갱신이 가능한지, 열거가 가능한지, 재정의가 가능한지 등의 상태를 정의하고, 프로퍼티에 접근할 때 값을 읽거나 저장할 때의 상태를 관리할 수 있습니다. 객체의 프로퍼티의 상태 자바스크립트 내부 슬롯과 내부 메서드 객체의 프로퍼티의 상태는 어떻게 정의될까요? 자바스크립트 내부 슬롯에 정의되어 있습니다. 내부 슬롯과 내부 메서드는 EcmaScript에서 자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 사용하는 의사 프로퍼티와 의사 메서드입니다. 자바스크립트 엔진에서 실제로 동작을 하지만,.. Study-Note/JavaScript 2022. 1. 10.
08. 변하지 않는 값 상수의 선언, const의 비밀. 안녕하세요. 좋아요요정입니다. ES6이전 과거에는 전역 변수가 아닌 변수를 할당하는 방법은 var 키워드를 이용한 선언만 있었습니다. ES6에서는 let과 const가 추가되어 var, let, const 3가지의 선언 방법이 있습니다. 지난 게시글에서는 var와 let으로 변수 선언 시 차이점에 대해서 알아보았습니다. 오늘은 ES6에서 let과 함께 추가된 const 키워드를 알아보겠습니다. const 🎃 const는 constant의 약어로 상수를 의미합니다. 상수란 변하지 않고 항상 같은 값을 가지는 수를 이야기합니다. 수학의 함수를 f(x) = x + 1 생각해보시면 변수와 함께 사용되는 상수값 1이 있죠? 이를 함께 이해해보시면 좋습니다. var만 있던 과거에는 모든 변수를 하나의 키워드로 선언.. Study-Note/JavaScript 2022. 1. 9.
07. var 외 않대요? (var와 let으로 변수 선언 시 차이점) 안녕하세요. 좋아요요정입니다 다들 이야기합니다. var를 쓰지마세요 등짝스매싱! 그래서 준비했습니다 var 외 않대요? var, let 키워드로 변수를 선언한 상태를 살펴보고, var를 쓰면 안 되는 이유를 이해해보는 시간을 가지겠습니다. var 👻 ES5 이전까지는 var를 사용하여 변수를 선언했다고 합니다. var에게는 자바스크립트를 더욱 다이나믹하게 만들어주는 엄청난 능력이 있었습니다. 1. 변수의 중복 선언 허용 var x = "오렌지꿀주먹"; var x = "오렌지똥주먹"; console.log(x) //"오렌지똥주먹" var 키워드로 선언한 변수는 중복으로 선언이 가능합니다. 사용했던 변수명인 것을 까먹고 다시 선언한다면? 그렇게 시간은 흐르고 흘러 유지보수를 할 때 이전에 사용했던 변수명을 .. Study-Note/JavaScript 2022. 1. 8.
06. 콜 스택, 실행 컨텍스트, 스코프 파악하기 안녕하세요 좋아요요정입니다. 오늘은 "스코프"에 대해 설명해보려 합니다. 스코프는 변수와 함수, 객체들의 생명주기와 접근성 등을 결정하는 아주 중요한 개념입니다. 유효 범위로써 변수와 매개변수가 어디까지 유효한지 나타냅니다. 저는 전역 스코프, 지역 스코프, 전역에서 선언된 변수는 지역에서 접근이 가능하지만, 지역에서 선언된 변수는 전역에서 접근이 불가능하다라는 정의를 통해 이해하고 있었습니다. 콜 스택과 실행 컨텍스트, 스코프, 스코프체인 정의도 알고 개념도 아는데 머릿속에는 두리뭉실하게 인식하고 있었습니다. 오늘은 콜 스택과 실행 컨텍스트, 스코프, 스코프체인을 제대로 잡고 스코프에 대해 다시 한번 정의해보겠습니다. 콜스택 콜 스택(Call Stack)은 메모리 상에 함수의 호출과 연관되는 데이터가 .. Study-Note/JavaScript 2022. 1. 4.
05. 자바스크립트 함수의 매개변수와 인수, 어떻게 동작할까? 안녕하세요! 좋아요요정입니다. 지난 게시글에서는 자바스크립트 함수의 정의와 함수 리터럴, 표현식과 선언문의 차이, 함수 호이스팅에 대하여 작성했습니다. 이번 게시글에서는 함수의 매개변수와 인수에 대하여 알아보고 어떻게 동작하는지, 사용하는 방법에 대해 알아보겠습니다! 매개변수와 인수 함수를 호출할 때 함수를 가리키는 식별자(함수이름)과 소괄호를 활용해 호출합니다. 함수이름(인자 목록) 함수가 호출되면 현재의 코드 실행 흐름을 중단하고, 호출된 함수로 실행 흐름을 옮깁니다. 이때 소괄호를 통해 입력한 값 인자 목록을 함수의 매개변수에 순서대로 할당이 되어 함수 실행 컨텍스트에 복제되어 매개 변수로 할당되어 집니다. 그리고 할당된 매개변수는 함수가 종료될 때 실행컨텍스트가 제거되고 콜스택이 제거되며 함께 제.. Study-Note/JavaScript 2021. 12. 31.
04. 자바스크립트 함수 리터럴, 표현식, 선언, 함수 호이스팅 안녕하세요 좋아요요정입니다. 코딩을 하다보면 숨을 쉬듯 함수를 생성하고, 사용하게 됩니다. 너무 자연스럽게 같은 모양으로 생성하며 사용하고 있었죠. 그런데 함수의 선언에도 기본 선언문, 표현식, 익명 함수 등 종류가 다양하다는 사실 알고 계셨나요? 함수의 생성 시점과 메모리는 이를 어떻게 저장하는지, 매개변수와 인수, 반환, 즉시 실행함수, 재귀 함수, 화살표 함수가 무엇인지! 오늘은 자바스크립트에서 가장 중요한 핵심 개념인 함수에 대해 작성해보겠습니다! 자바스크립트의 함수 함수란? 프로그래밍에서 함수란 실행 로직의 작업을 수행하기 위해 독립적으로 설계된 프로그램 코드의 집합으로 정의할 수 있습니다. 입력되는 값으로 특정 로직을 실행하고, 그에 대응하는 값, 결과물을 출력하는 코드 블록입니다. 위의 이미.. Study-Note/JavaScript 2021. 12. 31.

티스토리툴바