2024/05 23

24.05.31 배열과 연결 리스트(NodeList)

배열이란?배열이란 여러 연관된 데이터를 모아 관리하기 위한 데이터 타입이다. 배열은 크기를 미리 정해놓아야 하여 정적 자료구조로 분류된다. 내부 요소들은 메모리 상에 연속적으로 저장되며 연속된 메모리 주소를 할당 받게 된다.. 이러한 특성때문에 배열의 요소에 빠르게 접근할 수 있다. 연속된 메모리 주소를 할당 받기 때문에 우리가 이미 알고있는 인덱스(index)를 갖게 된다. 배열의 특정 위치 값을 찾기 위해 array[0]으로 접근할 때 대괄호 안의 숫자가 인덱스이다. 또한 인덱스를 갖기 때문에 임의 접근이 가능하여 접근과 탐색에 용이하다. 하지만 배열의 크기가 고정되어 있어, 배열의 크기보다 더 많은 데이터를 저장할 수 없다.  연결리스트란?연결리스트(Linked List)란 데이터를 효과적으로 저장..

2차 공부/TIL 2024.05.31

문자열 다루기 기본

먼저 작성한 코드function solution(s) { return (s.length===4 && !isNaN(Number(s))) ||(s.length===6 && !isNaN(Number(s))) ? true : false}11번 케이스에서 오류가 발생하였다.이유를 모르겠어서 힌트를 보니, 지수표기법으로 들어오는 문자열을 js에서 숫자로 인식하기 때문에 발생한 오류였다.예를들어 10e01 같은 수가 들어올 때에 대한 문제이다.문제에서 "숫자로만 구성"이라는 제한조건이 있기 때문에 e같은 문자열의 경우 아예 예외를 두어야 한다. 후에 작성한 코드function solution(s) { if (s.includes('e')) { return false } else..

24.05.30 TDZ와 Hoisting, var let const

스코프란?스코프란 변수에 접근할 수 있는 범위를 의미하며, 자바스크립트에서는 전역과 지역스코프가 존재한다.전역스코프란 어느 곳에서나 변수가 선언되어있어 제한없이 접근 할 수 있는 것이고,지역스코프란 특정한 공간에 변수가 선언되어있어 변수의 접근이 제한되어 있는 것이다.var a = 1;function test() { var a = 'hi'; console.log(a);}test();console.log(a);이러한 코드가 있다고 하자. 결과가 어떻게 출력될까?hi가 먼저 출력되고, 1이 출력될 것이다.test()함수의 선언 에서 a라는 변수가 'hi'로 선언 및 초기화가 되었으므로 hi를 먼저 출력한다.그리고 console.log(a)가 실행되는데, 이때 a는 전역변수로 선언 된 1이 출력된다..

2차 공부/TIL 2024.05.30

24.05.29 display: flex (2)

먼저, 이전에 설명했던 메인축 방향의 정렬은 "justify" 수직축(교차축)방향의 정렬은 "align"임을 기억하자.justify-contentjustify-content에는 flex-start(기본값) / flex-end / center / space-betweeen / space-around / space-evenly가 있다. 가나다라 마바사아 자차카 타파하 flex-start는 기본으로 설정된 값으로 row일 때는 왼쪽, column일 때는 위를 시작점으로 정렬한다.flex-end는 끝점으로 정렬한다. row일 때는 오른쪽, column일 때는 아래가 기준이다.center는 가운데로 내용물을 정리한다.space-between은 ..

2차 공부/TIL 2024.05.29

24.05.28 display: flex

오랜만에 새로워진 웹개발종합반 강의를 들었다.이전에 들었던 것과 비슷하게 html의 태그들을 알려주고, css를 사용하는 법을 알려주었다.결국엔 display: flex를 마주했다.한창 코딩을 할 때에도 이건가? 이건가? 하면서 헤맸던 속성이지만 이젠 떨쳐내려한다. display : flex; 가나다라 마바사아 자차카 타파하 이렇게 코드를 작성했다고 쳐보자. 그렇다면 화면은 아래와 같을 것이다.wrap 내부의 div의 height는 틀의 최대값을 가지게 되고, width는 미리 지정해준 값이나 내부에 들어있는 요소에 딱 맞게 적용된다.flex-direction: ~~;flex-d..

2차 공부/TIL 2024.05.28

자연수 뒤집기

내가 작성한 코드function solution(n) { var answer = []; for (let i = String(n).length-1; i>=0; i--) { answer.push(Number(String(n).split('')[i])) } return answer;}반복문을 사용해 인덱스가 큰 번호부터 0번까지 배열에 push하도록 작성하였다.  다른사람이 작성한 코드function solution(n) { return (n + '').split('').reverse().map(n => parseInt(n));}n+''으로 문자열로 바꾼 뒤 split메서드를 활용해 배열로 바꾸고reverse()메서드를 사용하여 뒤집은 뒤 map메서드로 각 요소를 숫자화..

배열의 평균값

내가 작성한 코드function solution(numbers) { let answer = 0; numbers.map(x=> answer+=x) return (answer/numbers.length).toFixed(1)}map 함수를 사용하여 기존에 선언한 변수 answer에 각 요소를 더하도록 작성하였다.그리고 return에서 평균값을 구해주고, toFixed()를 사용하여 소수점 1자리까지 표시하도록 작성하였다. function solution(numbers) { return numbers.reduce((a,b) => a+b, 0)/numbers.length;}reduce 메서드를 사용하면 더 간단하게 표현할 수 있다.reduce는 배열의 값을 더하거나 곱할 때 사용한다.위 코드..

짝수의 합

내가 쓴 코드function solution(n) { let answer = 0; for (let i=0; i반복문과 조건문을 활용하여 짝수일때만 변수에 더하도록 설정하였다. 다른사람이 작성한 코드function solution(n) { var answer = 0; for(let i=2 ; i반복문만을 활용하여 i가 2부터 시작해 짝수로만 증가하게하고 n까지 비교하여 더하도록하였다.내가 작성한 코드는 반복문도 두배에 매 반복마다 조건을 검사해야했는데, 이렇게 짝수로만 반복문을 사용하면연산시간을 엄청나게 줄일 수 있다.

두 수의 나눗셈

내가 작성한 코드function solution(num1, num2) { return Math.floor(num1/num2*1000);}Math.floor()을 이용해 내림을 사용하여 알고리즘을 풀어냈다.하지만 floor은 '버림'이 아닌 '내림'이므로 음수값이 출력되었을 때 틀리게 나온다.따라서 Math.trunc()의 '버림' 기능을 사용하는 것이 알맞다. 예를들어 num1이 -3, num2가 2일 때 -3/2는 -1.5이다.여기서 문제는 정수 부분만 원하므로 -1이 나와야하지만, 음수에서의 내림은 0방향에서 먼쪽으로 내리므로Math.floor()을 사용하게되면 -2가 나온다. 따라서 Math.trunc()를 사용하여 -1을 도출해내는 것이 알맞다. 알맞은 코드function solution(n..

24.05.27 React 트랙을 신청한 이유

내가 React 트랙에 참여한 계기는 무엇인가요?제일먼저, 공부하는 것에 재미가 있었다. 의무교육과 전공, 전공심화까지 16년의 교육을 받았지만 암기형식으로 배우고 시험을 위해 공부했던 때는 좋은 성적을 받을 때만 공부에 대한 보상감을 느꼈지만, 이전에 웹 프로그래밍을 배우며 공부에 흥미를 느꼈던 것이 가장 큰 이유이다. 이전 과정을 마치고 졸업하기위해 학교로 돌아갔을 때에도 지루하고 그냥 시간을 죽이며 살아왔던 것 같다. 하지만 코딩을 배울 때 만큼은 배움에서의 재미를 느껴 React 트랙에 참여하게 되었다.내가 이해한 개발자는 어떤 역할을 하는 사람인가요? 내가 이해한 개발자의 역할은 소통창구이다. 특히나 프론트엔드의 경우 더욱이 그렇다고 생각한다. 백엔드와 데이터의 흐름을 조율하고, 디자이너와 뷰를..

2차 공부/TIL 2024.05.27