의존성 주입 의존성 주입은 소프트웨어 개발에서 객체지향 설계 원칙과 디자인 패턴에 기반을 둔 개념이다. 등장배경 소프트웨어 개발에서 클래스들간의 결합도를 낮추고 유지보수성과 재사용성을 향상시키는 것은 중요한 목표이며, 의존성 주입은 이러한 목표를 달성하기 위해 등장한 디자인 패턴 중 하나이다. 의존성 주입 개념이 등장하기 이전에는 클래스가 직접 의존하는 객체를 클래스 내부에 생성하는 방식으로 의존성을 처리했다. 이는 클래스와 의존하는 객체 사이의 결합도를 높여 코드의 유연성과 테스트 용이성을 저해하는 문제점이 있었다. 이에 의존성 주입 개념이 등장하여, 클래스가 의존하는 객체를 외부로부터 주입받는 방식으로 의존성 문제를 해결하고, 클래스간의 결합도를 낮추게 되었다. 장점 유연성 : 의존성 주입을 사용하면..
class Player { static description = "Game of Throne" static newPlayer() { return new Player("Ser", "Jaime") } numLives = 10 #score = 0 constructor(first, last) { this.#onNewbee() this.first = first this.last = last } get fullName() { return `whose name is ${this.first} of house ${this.last}` } set fullName(newName) { const [first, last] = newName.split(" ") this.first = first this.last = last co..
class Player { numLives = 10 #score = 0 constructor(first, last) { this.#onNewbee() this.first = first this.last = last } get fullName() { return `whose name is ${this.first} of house ${this.last}` } set fullName(newName) { const [first, last] = newName.split(" ") this.first = first this.last = last console.log('FullName has changed') } set firstName(newFirst) { this.first = newFirst console.log..
선요약 클래스 필드는 클래스로 인스턴스를 만들때 모든 인스턴스가 사용할 수 있는 프로퍼티를 생성한다. 프라이빗 필드는 인스턴스에 프로퍼티를 만들어주나, 클래스 내에서만 수정이 가능한 프로퍼티를 생성한다. 둘다 문법적 설탕의 개념이다. 클래스 class Player { numLives = 10 #score = 0 constructor(first, last) { this.#onNewbee() this.first = first this.last = last } setScore(newScore) { this.#score = newScore } getScore() { return this.#score } loseLife() { this.numLives -= 1 } #onNewbee() { console.log("..
/* 까지만 쳤을 때 자동완성 기능으로 /** */ 이 나오면 엔터쳐서 들어감. 자동적으로 함수에 있는 파라미터와 리턴값이 설정됨. 그럼 위와 같이 함수의 설명을 볼 수 있게됨. 이 기능들은 기본기능이라 별도로 무언가를 설치할 필요가 없음. 다만 따로 문서화를 하려면 라이브러리를 설치해야하는 것으로 알고있음.
버튼을 누르면 2초 뒤 DOM이 조작되어 브라우저에 렌더링 된다. 0. HTML 뼈대 및 정리 안된 코드 분식점 음식제작 한 껏 늘려쓴 코드이다. if문이 중첩되어있고, 모든 기능들이 함수 하나에 전부 내장되어 있다. 1. if 합치기 if문이 2개라면 연산자로 묶어서 하나로 표현해줄 수 있다. 이를 통해 코드 한 줄을 줄일 수 있고, 들여쓰기를 삭제해줄 수 있다. 1-1. if문 밖으로 코드 빼기 (+ 드모르간의 법칙) 논리 연산에서 AND와 OR 연산을 서로 바꾸고 각 변수에 부정을 취할 때 두 값은 논리적으로 같다는 것이 드모르간의 법칙이다. ('el이 존재하며 orderList가 배열로 존재해야 한다'와 'el이 없거나 orderList가 없어야 한다'는 논리적 동치관계) 여기에서는 드 모르간의 ..
문제 const grades = [80.55, 90, -95, -45, 44.3, 100, 177] /* 아래 조건에 따른 새로운 배열을 만들어서 console.log 해야 합니다. 1. 0 ~ 100점이 유효한 점수입니다. 2. 소수점을 제거해주세요. 3. 각 엘레멘트의 뒤에 '점'을 추가해주십시오. ex) 80점 4. console.log로 출력 해주십시오. */ const validGrades = [] // 새로운 배열입니다. for문, if문 const grades = [80.55, 90, -95, -45, 44.3, 100, 177] const validGrades = [] // 새로운 배열 // 1번 풀이 for (let grade of grades) { if (grade >=0 && grad..
product라는 객체가 있다. info라는 객체에 product 키는 값으로 product라는 객체를 가지고 있다. 그래서 전역 product 객체와 info 내부 product의 객체는 주소값이 같다. 기초를 다시 떠올려보기 위한 장난이었다.
(1)에 이어... 격자 내부에 좌표를 추가해보았다. 코드 흐름 클래스 또는 생성자함수를 사용할 수 있는가? - YES!! 위의 경우는 BOX라는 오브젝트를 수없이 생성해야 하므로 기능적으로 클래스로 구현하기 용이하다. 내 구상과 디자인에 적합한 HTML 코드와 CSS 코드를 작성한다. Box 클래스를 생성한다. 각 박스는... - div element로 생성하고, css class를 달고있어야 한다. - 기본적으로 텍스트를 숨기고 있어야 한다. - div 스스로 텍스트 토글 기능에 관한 이벤트 리스너를 달고 있어야 한다. (클로저로 인해 이벤트 핸들러는 row, col, showing 변수에 접근할 수 있다.) container에 add 한다. 이후 n x n 박스를 만드는 함수를 제작하면 된다. 코드..
만드는 이유 1. 심심한 주말, 공부하기 위해 2. 기능을 프로그래밍할 때 거쳐야하는 사고방식에 대해 익숙해지기 위해 단순하다. 숫자를 입력하면 n x n의 형식으로 네모 격자가 출력된다. 19를 입력하면 19x19가 되어 바둑판이 될 것이다. 코드 코드설명 html에서는 container로 사용할 div와 input 태그를 만들어준다. css에서는 격자가 들어갈 div의 스타일을 미리 설정해준다. 격자의 역할을 하기 위해 inline-block으로 설정되었으며, 사이즈는 정사각형(50px)으로 맞춰준다. JavaScript에서는... container div와 input의 dom을 취득한다. 최초 앱 실행시 input에 포커스가 이동하도록 .focus() 메서드를 실행해준다. Box라는 생성자함수를 만..
