프로그래밍 잡동사니

배열 배열(Array)이란 여러 개의 값을 순차적으로 나열한 자료구조로, 배열이 가지고 있는 값을 요소(Element)라고 부른다. 각 요소는 자신의 위치를 나타내는 0 이상의 정수인 인덱스(index)를 가지며 같은 타입의 요소가 연속적으로 위치하는 것이 일반적이다 const arr = [1, 2, 3, 4, 5]; const arr2 = new Array(3).fill(1); // -> [1, 1, 1] const arr3 Array.of(1, 2, 3); // -> [1, 2, 3] const arr4 = Array.from({ length: 3 }, (_, i) => i); // -> [0, 1, 2] typeof arr // -> object 배열은 객체 타입이며 리터럴, Array 생성자 함수..

중간고사가 끝나고, 대망의 우테코 웹 프론트엔드 프리코스 과정이 시작됐다 지원만 하면 프리코스를 참여할 수 있기에 정말 많은 사람들이 참여했고, 생각보다 지인들도 많아서 반가웠다😊 프리코스만으로도 혼란한 프론트엔드 생태계에서 기본기를 닦을 수 있는 좋은 경험이 되지 않을까 싶다. 열심히 해보자! 진행 방식은 다음과 같다 매주 수요일에 메일로 미션이 보내지고, 다음 주 화요일까지 구현을 완료해 제출해야 한다 미션은 '기능 요구 사항 / 프로그래밍 요구 사항 / 과제 진행 요구 사항'으로 구성된다 기능 요구 사항을 구현할 때는 기능 목록을 만들고, 기능 단위로 커밋해야 한다 미션 구현을 완료한 후에는 GitHub과 우아한테크코스 지원 플랫폼 양쪽에 모두 제출해야 한다 지원 플랫폼에 과제를 제출할 때는 경험한..

코드 보안 1. 버퍼 오버플로우 버퍼 오버플로우란 할당된 메모리(버퍼)를 초과하도록 데이터를 기록해 프로그램 장애를 일으키는 공격으로, 다른 메모리 영역을 침범해 프로그램의 비정상 종료를 일으킬 수 있다 * 버퍼 오버플로우에 취약한 함수를 쓰지 않고 최신 업데이트된 운영체제를 사용해 대처 2. 포맷 스트링 공격 포맷 스트링이란 C 언어의 출력 함수인 printf에서 쓰는 문자열이지만 출력 목적이 아닌 메모리 변경 목적으로 사용도 가능하기 때문에 메모리를 변조시킬 수도 있다 3. 메모리 해킹 메모리 해킹이란 프로그램의 동작에 직접 관여하지 않고 프로그램이 실행되는데 필요한 정보를 저장해둔 메모리를 조작하는 공격으로, 흔적이 남지 않아 인지하지 못하는 경우가 많다 * 메모리 주소에 저장되는 값을 암호화해서 ..

WEB / HTTP 비지속 연결 HTTP: non-persistent connection은 하나의 연결을 통해 하나의 리소스만 전송하며 여러 개의 파일 전송은 매번 연결/단절이 필요해 성능이 저하된다 지속 연결 HTTP: persistent connection은 하나의 연결을 통해 여러 개의 리소스를 전송할 수 있어 성능이 우수해 기본적으로 사용되는 방법이다 쿠키 / 웹 캐시(프록시) 쿠키(Cookie)는 대부분의 웹사이트에 지원되며, 사용자 인증 / 장바구니 / 사용자 세션 관리 등에 사용될 수 있지만 보안 상의 위협이 될 수도 있다 HTTP 응답으로 쿠키 헤더가 도착 > 사용자의 PC에 쿠키 저장 > 사용자가 다음 요청에 쿠키를 실어서 보냄 > 유효시간동안 서버는 DB에 쿠키 저장 웹 캐시(프록시)는..

ES6 함수의 추가 기능 const obj = { x: 1, // foo는 메서드이다. foo() { return this.x; }, // bar에 바인딩된 함수는 메서드가 아닌 일반 함수이다. bar: function() { return this.x; } }; console.log(obj.foo()); // 1 console.log(obj.bar()); // 1 ES6 이후 메서드는 객체 내에서 축약 표현으로 정의된 함수만을 의미한다 const multiply = (x, y) => x * y; multiply(2, 3); // -> 6 화살표 함수는 선언문이 아닌 표현식으로 정의해야 하며 호출 방식은 동일하다 * prototype 프로퍼티가 없어 인스턴스/프로토타입 생성 불가 class Prefixer..

클래스 자바스크립트는 프로토타입 기반 객체지향 언어로, 인스턴스 생성에 생성자 함수가 있어 클래스가 굳이 필요 없었지만 ES6에 추가된 클래스 문법은 다음과 같은 몇 가지 차별점이 있다 생성자 함수와 달리 new 없이 호출하면 에러가 발생한다 상속을 지원하는 extends와 super 키워드를 제공한다 함수/변수 호이스팅이 발생하지 않는 것처럼 동작한다 (TDZ) 클래스 내의 모든 코드에 암묵적으로 strict mode가 지정된다 constructor 및 메서드들의 [[Enumerable]] 값이 false로, 열거되지 않는다 // 클래스 선언문 class Person { // 생성자 constructor(name) { // 인스턴스 생성 및 초기화 this.name = name; // name 프로퍼티..

클로저 클로저(Closures)는 둘러싸여진 상태의 참조와 함께 다발로 묶여진 함수의 콤비네이션으로, 함수가 생성되는 시점에 내부 함수로부터 외부 함수에의 접근 권한을 준다 const x = 1; function outerFunc() { const x = 10; function innerFunc() { console.log(x); // 10 } // innerFunc와 outerFunc 사이의 closure (oER) innerFunc(); } // outerFunc와 전역컨텍스트 사이의 closure (oER) outerFunc(); 함수 내부의 중첩 함수에서 상위 스코프의 변수에 접근할 수 있다! * 만약 innerFunc가 outerFunc 외부에서 정의되었다면 outerFunc의 변수에 접근 불가..

보호되어 있는 글입니다.

strict mode function foo() { x = 10; } foo(); console.log(x); // 10 위 코드는 실행이 안될 것 같지만 x가 암묵적 전역으로 들어가며 문제없이 실행된다 'use strict'; function foo() { x = 10; // ReferenceError: x is not defined } foo(); ES5부터 strict mode를 위와 같이 활성화해 의도적으로 에러를 발생시킬 수 있다 * 암묵적 전역 / delete 연산자 사용 / 매개변수 이름 중복 / with 문의 사용 등 컨벤션을 커스텀해 적용할 수 있는 ESLint 등의 린트 도구를 사용하는 것이 더 적절하다 빌트인 객체 표준 빌트인 객체는 object, String, Number, Bool..

프로토타입 JS는 명령형 / 함수형 / 프로토타입 기반 / 객체 지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어다. 간혹 객체지향 언어가 아니라는 오해를 받지만 JS는 클래스 기반 객체지향 프로그램 언어보다 더 강력한 프로토타입 기반의 객체지향 프로그래밍 언어이며 원시 타입의 값을 제외한 모든 값들(함수, 배열, 정규 표현식 등)은 객체다 객체지향 프로그래밍(OOP) = 객체의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임 const circle = { radius: 5, // 반지름 // 원의 지름: 2r getDiameter() { return 2 * this.radius; }, // 원의 둘레: 2πr getPerimeter() { return 2 * Math.PI * this.radi..