전체 글 192

[230316] CLASS 상속에서 spuer 참조 시 this를 써버리면..?Error..Error...왱알왱알..

🍀 오늘의 날짜 : 23년 03월 16일 🍀 오늘의 주제 : CLASS 의 상속과 프로토타입 🔖 Super 참조 CLASS 상속할 때, super 키워드를 이용해서, 상위 클래스의 constructor을 호출 할 수 있습니다만, 메소드 내에서 super을 참조하여, 상위 클래스의 메서드를 호출 할 수도 있습니다. class Rectangle { // 1. 상위 클래스 constructor(width, height) { this.width = width; this.height = height; } getArea() { return this.width * this.height; } toString() { return `width = ${this.width}, height = ${this.height}`; }..

[JS] 프로토타입 : Prototype + Class 상속

JS에서는 프로토타입 기반의 객체지향 언어입니다. 프로토타입 기반 객체지향 언어는 Class가 필요없는 객체지향 프로그래밍 언어어였습니다만, ES6에서 CLASS 기능이 출현했습니다. 🔖 ES5에서 상속은 어떻게 구현 했을까? 이전의 경우에는 ' 프로토타입'을 통해 을 구현했습니다. //ES5 생성자 함수 var Person = (function () { //생성자 함수 function Person(){ this.name = name; } //프로토타입 메서드 Person.prototype.hello = function(){ console.log(`Hi I am ${this.name}`); }; //생성자 함수 반환 return Person; }()); //인스턴스 생성 let emma = new Per..

[JS] JS와 OOP[객체지향 프로그래밍]

🔖 JS는 객체지향 프로그래밍 언어인가? JS가 태어난 1955년에는 HTML페이지를 동적으로 만드는 것이 목적이었던 언어였기 때문에 시작은 '인터프리터 언어' 였습니다. 이후 2009년 구글은 JS의 V8엔진을 출시하고 획기적으로 발전했으며, ES6과 Node.js의 등장으로 JS는 단순 '인터프리터 언어' 가 아닌 '객체지향 언어'에 도달했다고 보는 시각이 많아졌다고 합니다. * 물론 JS을 객체 지향으로 작성 가능했었음. # 컴파일언어 고급 언어(프로그래밍 코드) → compile → 저급 언어(기계어) > 인터프리팅 방식보다 빠름. # 인터프리터언어 JS 엔진 내부에서 실행 중 컴파일이 필요한 경우에 내부에서 컴파일 🔹JavaScript, 인터프리터 언어일까? 🔖 객체지향의 주요 특징 4 가지 #..

[230315] JS와 객체지향 프로그래밍 : 클래스와 인스턴스

🍀 오늘의 날짜 : 23년 03월 15일 🍀 오늘의 주제 : 클래스와 인스턴스 OOP : Object Oriented Programming - 객체 지향 프로그래밍 🔖JS에서 클래스와 인스턴스 # CLASS : 주요 도면(청사진) # INSTANCE : 도면( class ) 를 바탕으로 다양한 객체를 만드는 프로그래밍 패턴 # constructor : class로 생성된 객체를 생성하고 초기하기 위한 특수한 메서드 * class 안에 한 개만 존재 # 프로토타입 : 객체를 상속하기 위해 사용. **CLASS - 일반 함수와 구분하기 위해 ' 대문자 ' 로 시작. //class [1] function Car( color ) { brand, name, color }; //class [2] - ES6 clas..

[230314] 고차함수 : map(), filter(), reduce()

🍀 오늘의 날짜 : 23년 03월 14일 🍀 오늘의 주제 : 고차함수 🔖 28. 문자열의 요소를 갖는 배열을 입력 받아, 가장 긴 문자열의 길이를 리턴. # 옳은 답 # 왜 reduce문 안의 if문에서 .length를 붙여서 return을 하면 'tr'의 길이를 출력 하는 것일까요? let arr = ['one', 'two', 'tr']; function getLong(arr) { if (arr.length !== 0) { return arr.reduce(function (acc, cur) { if (acc.length >= cur.length) { console.log('acc ' + acc.length + ' ' + acc); // acc 3 one console.log('cur ' + cur.le..

[JS] 고차함수 : 커링함수

* * 작성 중인 글입니다. * * 고차 함수(higher order function)은 함수를 전달인자(argument)로 받을 수 있고, 함수를 리턴할 수 있는 함수. # 빅보스 JS에서 함수는 1급 객체 함수. 콜백함수(callback fuction)는 다른 함수의 전달인자로 전달되는 함수 #제물 어떤 작업이 완료되었을 때 호출하는 경우가 많아서 답신 전화를 뜻하는 콜백함수라는 이름이 붙음. * 콜백함수를 전달받은 고차 함수는 함수 내부에서 이 콜백 함수를 호출(invoke)할 수 있고, 조건에 따라 콜백 함수의 실행 여부를 결정 할 수도 있습니다. 아예 호출하지 않을 수도 있고, 여러 번 실행 할 수도 있다. 특정 작업의 완료 후에 호출하는 경우는 이후에 충분히 접할 수 있음. * 함수를 리턴하는..

[230313] Section 01 회고

🍀 오늘의 날짜 : 23년 03월 13일 🍀 오늘의 주제 : KPT 회고 코드스테이츠 SECTION 01 이 완료되었습니다. 앞으로 3개의 SECTION이 더 남았지만, 짧은 기간 동안 많은 것을 배운 것 같습니다. 우아한형제들이 재택 근무 중에 사용한 KPT 기반으로의 회고를 바탕으로 SECTION 01에 대한 회고를 작성해보겠습니다. - 🔖 KEEP # 만족스러운 부분, 계속 이어가면 좋을 부분 - 정보처리기사 필기 합격 .. 4월 23일 실기도 한번에 합격할 수 있었으면.. - 스스로 CSS로 레이아웃 구성을 완성 할 수 있게 되었음. - 스스로 HTML으로 원하는 방식으로 구조를 짤 수 있게 되었음. 🔖 PROBLEM # 목표를 이루는데 장애물이 되었거나, 개선이 필요한 부분 - 정보처리기사로 인..

[230310] 다수의 데이터 객체 DOM으로 부르기 + 페이지네이션

* * 작성 중인 글입니다. * * 🍀 오늘의 날짜 : 23년 03월 10일 🍀 오늘의 주제 : 다수의 객체 데이터 DOM으로 불러오기, 페이지네이션 🔖 다수의 객체 데이터 DOM으로 불러오기 # 태그 안 : DOM이 완성되지 않은 상태에서 자바스크립트가 실행 - 에러 발생 # 태그 끝나기 전 : HTML의 body가 완성된 후 자바스크립트 실행 - 페이지 로딩 시간 단축 * 단, 자바스크립트 파일 준비 전 HTML파일 로딩되어버려서 원치 않은 화면이 먼저 로딩 될 수도.. 🔖 페이지네이션 : [ FAILED ] 오늘자 회고 🌱 추가 공부 필요 내역 🔹페이지네이션 기능 구현 🔹검색 기능 기능 구현 🌱 도움이 될 만한 사이트 추천 🔹 🔹 🌱 관련 정보 정리 글 🔹 🔹

[230308] DOM _ script.js위치에 따른 차이점 / JS클릭시 화면 전환기법_[FAILED]

🍀 오늘의 날짜 : 23년 02월 16일 🍀 오늘의 주제 : DOM { 유효성 검사) 🔖 위치에 따른 차이점 # 태그 안 : DOM이 완성되지 않은 상태에서 자바스크립트가 실행 - 에러 발생 # 태그 끝나기 전 : HTML의 body가 완성된 후 자바스크립트 실행 - 페이지 로딩 시간 단축 * 단, 자바스크립트 파일 준비 전 HTML파일 로딩되어버려서 원치 않은 화면이 먼저 로딩 될 수도.. 🔹[HTML] script 태그의 위치에 따른 차이점 🔖 JS를 이용한 클릭시 화면 전환 ( + transition : Failed ) # ocument.getElementsByClassName을 이용하여 여러 Class 속성들에 접근하기 위해서는 반드시 뒤에 배열을 이용하여 몇 번째 요소에 접근할 것인지 지정해야 ..

[230307]23년 1회 정보처리기사 필기 합격_upload(230321)

23년 1회 정보처리기사 필기 합격했습니다! 기출에서 봤던 문제보다 뭐랄까.. 조금 꼬아서 낸 듯한 문제들이 많아서 처음부터 많이 당황을 했지 뭡니까? .. 아무튼 최종 제출 하기 전에 엄청나게 쫄아가지고 평소 모의고사 풀 때는 그래도 쉽게 1시간 이내에 컷 했는데 거진 90분 이상? 소요 된 것 같네요. 전 5과목은 쉬웠고, 개인적으로 1과목 2과목이 조금 힘들었습니다. 모의고사에서는 오히려 1,2 과목이 쉬웠는데... 쨌든 아슬아슬 77점?? 으로 합격했습니다. 그 글자를 본 순간 어찌나 ... 행복했던지 ㅠㅠㅠ 안도의 한숨 인터넷 보니까 정보처리기사 쉽다고 막 1주일 컷, 3일 컷 이러던데.. 저는 영 머리가 그렇게 비상하게 돌아가는 편은 아니라서... 조금 긴 시간 고생 좀 했지만.. 그래도 나름..