프로그래밍 공부하기

2021/01/14 - [Javascript/Basic JS] - 객체 지향 프로그래밍(Object Oriented Programming) 이전 포스팅에 이어 객체지향프로그래밍의 특징에 대해 알아보자. 3. 객체 지향 프로그래밍의 특징 객체지향프로그래밍은 크게 4가지의 특성이 있다. 1) 캡슐화(Encapsulation) class Circle{ constructor(radius, color){ this.radius = radius; this.color = color } expendRadius(){ this.radius += 1 } } let c1 = new Circle(4, "red"); //반지름이 4이고 빨간색인 원 let c2 = new Circle(7, "blue"); //반지름이 7이고 파란색..

프로그래밍이란 우리가 해결하고 싶은 문제 혹은 알고리즘을 프로그래밍 언어를 사용하여 구현하고 이를 컴퓨터에게 위임하여 자동화하는 것이다. 프로그래밍에서 문제 해결을 위해 필요한 절차를 구현하는 방법 중 대표적인 것이 객체지향 프로그래밍이다. 1. 객체지향 프로그래밍이란 1) 절차지향 프로그래밍 C, Pascal, BASIC 등 비교적 과거의 하이 레벨 프로그래밍 언어는 절차적 프로그래밍을 수행했다. 어떤 문제를 해결하기위해 일을 순서대로 처리하는 것이다. 즉, 어떠한 논리를 순서대로 써내려가는 것이다. 절차지향프로그래밍은 복잡한 논리를 가진 문제를 만났을 때 구현과 유지보수가 어려워지는 문제점이 있다. 후에 절차적 프로그래밍의 하위개념인 구조적 프로그래밍이란 개념이 등장하면서 프로그램 전체를 독립적인 단..

JavaScript에서 this는 함수 호출 방법에 따라 다른 값을 가리킨다.(바인딩) 그러나 프로그래머가 직접 함수 안의 this를 명시적으로 지정할 수 있는 방법이 있다. 바로 call, apply, bind 함수를 사용하는 것이다. 1. call const student = { name: "ihl", age: 14, printProfile: function(repeat) { for(let i = 0; i < repeat; i++) console.log(`이름: ${this.name}, 나이: ${this.age}`); } } let kim = {name: 'kim', age: 21}; student.printProfile(3); //'이름: ihl, 나이: 14' x3회 출력 student.prin..

화살표 함수란 function 표현을 짧게 줄여쓴 것으로 function과 같은 기능을 하지만 일부 요소에 대해 function과 다르게 작동한다. 1. 사용방법 //1. 함수 선언식 function add(a,b){ return a + b } //2. 함수 표현식 let add = function(a, b){ return a + b; } 지금까지 사용해온 함수 선언은 위와 같다. 이 함수들은 화살표 함수 문법으로 간단하게 축약해보자 (함수 선언식과 표현식의 차이는 이전 포스팅을 참고하자:2020/12/17 - [Javascript/Basic JS] - 호이스팅(Hoisting)) //1. function 키워드 생략 let add1 = (a,b) => { return a+b; } //2. functio..

undefined와 null은 모두 값이 없음을 나타낸다. 그러나 자세히 살펴보면 둘은 다른 의미, 다른 목적을 갖고있다. 1. undefined 프로그래밍을 하며 undefined값을 만날 수 있는 경우는 다음과 같다. 값을 대입하지 않은 변수에 접근할 때 객체(배열 등 포함)의 존재하지 않는 속성에 접근할 때 return이 없는 함수의 실행 결과 프로그래머가 직접 undefined를 할당해주었을 때 let a; function fn(){} let arr1 = []; a //undefined arr1[5] //undefined fn()//undefined 프로그래머가 직접 undefined를 할당해주는 경우를 제외하면 undefined는 값이 없는 변수에 접근할 경우 JavaScript가 전달해주는 값..

앞선 포스팅에서 JS 데이터 타입의 불변성과 가변성에 대해 알아보았다. 이번엔 불변성과 가변성의 또다른 예시인 let과 const에 대해 비교해보자. (이전포스팅: 2021/01/07 - [Javascript] - 불변성과 가변성 1 - JS의 자료형) 재할당 재선언 Scope var 가능 가능 Function let 가능 불가능 Block const 불가능 불가능 Block let과 const와 var를 비교하면 다음과 같다. 여기서 주목해야할 것은 '재할당' 부분이다. let은 재할당이 가능하고 const는 재할당이 불가능하다는 말을 변수의 값(value)를 변경할 수 있고 없고로 해석할 수도 있다. 그러나 다음과 같은 예외가 있다. const obj1 = {}; obj1.a = 77; const로 ..

JavaScript의 자료형은 크게 Primitive Type(원시타입)과 Refefence Type(참조 타입)으로 나뉜다. Primitive type은 할당이나 연산 시 값이 복제되고 Reference type은 참조된다. 또한 Primitive type은 불변값(immutable) 이며 Referenct type은 가변값(mutable)이라고 알려져있다. 이를 구제척으로 알아보자. 1. Primitive Type 1) 선언과 할당 Primitive type을 선언하고 값을 할당하면 메모리(식별자)에 값(숫자, 문자열 등)을 저장하게 되며 변수를 사용하거나 다른 변수에 할당할 때 메모리 안에 있는 저장된 값을 사용하게 된다고 배운다. 그러나 엄밀히 말하면 primitive type 또한 주소 값을 갖..

1. 재귀함수 재귀함수란 자기자신을 다시 호출하여 문제를 해결하는 함수이다. 주어진 문제가 비슷한 구조의 더 작은 문제로 나누어질 수 있거나, 중첩된 Loop가 너무 많은 경우, 중첩된 Loop의 중첩의 정도를 미리 알 수 없을 경우 사용한다. 예를 들어 3!의 값을 구해보자. 3! = 3 * 2!로 나타낼 수 있으며 2! = 2 * 1!, 1! = 1*0!으로 나타낼 수 있다. 이 때 0보다 작은 factorial 값은 존재하지 않으므로 0! = 1이 가장 작은 factorial 값이 된다. 즉 다음 그림과 같은 상황인 것이다. 그림을 다시 코드로 나타내면 다음과 같다. //factorial 구하기 function factorial(num) { if(num < 1){ return 1; } return ..

객체의 속성이나 메소드에 접근할 때 해당 항목이 없다면 오류가 발생된다. 이러한 상황에서 오류발생 대신 undefined를 리턴하는 것이 ?. 연산자이다. 단, Internet Explorer 브라우저는 이를 지원하지 않는다. 1. 속성/배열 let obj = {}; obj.prop1 //undefined obj.prop1.prop2 //Uncaught TypeError: Cannot read property 'prop2' of undefined obj.prop1?.prop2 //undefined obj.prop1?.prop2?.prop3 //undefined let arr = []; arr[10] //undefined arr[10][1] //Uncaught TypeError: Cannot read pr..

JavaScript에는 ??라는 연산자가 있다. a ?? b 라는 연산을 수행하면 첫 번째 피연산자가 null 또는 undefined일 때 두 번째 피연산자를 반환하고, 그렇지 않으면 첫번째 피연산자를 반환한다. console.log(null ?? 1); //1 console.log(null ?? 0); //0 console.log(0 ?? null); //0 console.log(null ?? undefined); //undefined console.log(undefined ?? null); //null 위와 같이 ??연산의 결과는 첫 번째 항이 null 또는 undefined인지에만 영향을 받으며 ||와 달리 falsy한 값인지는 상관이 없다. ??연산자를 사용하면 null 또는 undefind가 아..