일상의 기록/🌷DAILY 회고록 : 코드스테이츠 54

[230320] 문자열 뒤집기

🍀 오늘의 날짜 : 23년 03월 20일 🍀 오늘의 주제 : 문자열 뒤집기 🔖 문자열 뒤집기 # .split( '', -1 ) 이렇게 하면, 공백도 문자열 분해 시 요소로 담을 수 있다. 참고 블로그 # str.split().reverse().join() 으로 간단하게 문자열 뒤집을 수 있다. 참고 블로그 * 메서드 사용 금지의 경우 for 문으로 뒤에서부터 접근하면서 넣어주면 된다. 참고 블로그 * join( )은 기본 적으로, [ , ] 이 쉼표로 문자열을 합친다. * 배열 합치는 방법들 중 빠른 순은 [ push( ) > ...spread > concat( ) ] 순이라고 한다. 참고 블로그 이번 문법을 배우면서 예전에 우테코 프리코스가 꽤 기본적인 과제였다는 것을 느끼게 되었습니다. 지금이라면 1..

[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}`; }..

[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..

[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일 컷 이러던데.. 저는 영 머리가 그렇게 비상하게 돌아가는 편은 아니라서... 조금 긴 시간 고생 좀 했지만.. 그래도 나름..

🌷 [230303] ES6 주요 문법 ( spread /rest )

🦄 너무너무 히므드민다. 🍀 오늘의 날짜 : 23년 03월 03일 🍀 오늘의 주제 : ES6 주요 문법 개요 spread/rest 문법 구조 분해 (destructing) 화살표 함수 (arrow function ) 🌷햇깔렸던 부분들 + TIP🌷 #배열과 짱친 spread문법 [ ... ] 배열을 풀어서 인자로 전달하거나 각각의 요소로 넣을 때 사용합니다. # 배열 합치기 # 배열 복사 # 객체에서 사용 # 함수에서 나머지 파라미터 받아오기 " 💡spread는 원본 배열 해치지 않아요~! " rest 문법 [ ... ] 파라미터를 배열의 형태로 받아서 사용할 수 있습니다. 제가 이해한 것은 받은 파라미터를 찢어버리는 느낌입니다. (객체 / 배열 동일하게 작동 ) 🔖 reduce( ) 배열과 화살표 함수와..

🌷[230302] 코드스테이츠 부트캠프 : 스코프와 클로저 (2탄)_[FAILED]

🦄 03월 02일 배운 수업에 이어 스코프와 클로저를 공부해봅니다. ➡️ [230302] 코드스테이츠 부트캠프 : 참조 자료형과 원시 자료형 (1탄) 🌷햇깔렸던 부분들 + TIP🌷 💠스코프 (SCOPE) = 변수에 접근할 수 있는 범위 Ex. 함수 안 : 안쪽 스코프 / 함수 밖 : 바깥쪽 스코프 [예시 1] # Error가 발생한 두 번째 출력 문( firstName ) : 함수 안쪽 스코프에서 정의 → 함수 밖에서 접근 불가 [예시2] # 함수 안( IN )의 출력 문 : 변수 message가 " 함수 안 " 에서 선언 되었기 때문에 바깥 쪽 스코프 : "name" 을 끌어올 수 있었음 → 정상적으로 출력 가능 # 함수 밖( Out )의 출력 문 : message 변수가 함수 안 스코프에서 선언되었기..