분류 전체보기 344

24.07.23 변수선언과 데이터 할당 / 불변하다 vs 불변하지 않다.

let str = 'test'str = 'modify'변수 선언 및 할당 시 변수이름(식별자)와 변수(데이터)가 각각 메모리 상에 저장된다.아래와 같이 식별자(변수이름)은 1002번 주소에 str로 저장되고, 해당 식별자가 지닌 변수(데이터)의 주소를 가지는 것을 알 수 있다.데이터는 따로 주소값을 받아 저장되는데, 처음 5008번을 받고 다시 재할당되자 기존 데이터 주소는 변화시키지 않은 채로 새롭게 주소값을 받아 5009번에 modify를 저장하고, 해당 주소를 str 식별자에 붙여준다.  변수 vs 상수 - 변수 : 변수 영역 메모리를 변경할 수 있음 - 상수 : 변수 영역 메모리를 변경할 수 없음 불변하다 vs 불변하지 않다 - 불변하다 : 데이터 영역 메모리를 변경할 수 없음 - 불변하지 않다 ..

2차 공부/TIL 2024.07.23

24.07.22 JavaScript 문법 종합반 1, 2주차

리액트로 들어가기 전 Javascript에 이해를 더 잘 이해하기 위한 주차이다.1, 2주차 강의내용은 아는 것이 많았지만, 몰랐거나 까먹은 부분도 있어 해당 부분에 대해서만 정리해보고자 한다. 1. 단축평가논리합, 논리곱 연산자를 이용하여 양 변에 따라 알맞은 값을 사용한다.console.log(true || "something") // trueconsole.log(false || "something") // somethingconsole.log(true && "something") // somethingconsole.log(false && "something") // false조금 생각해 보았는데, 논리합 ||연산자는 양 변중 단 하나라도 truthy하면 true를 뱉어내므로 첫 줄 true || s..

2차 공부/TIL 2024.07.22

24.07.19 미니프로젝트를 마치며

사실상 작업은 어제 끝났었다.오늘은 발표 전 프로젝트 코드를 다시 읽어보며 내가 모든 코드를 이해했는지 확인해보았다.스크롤 기능의 특정 함수를 제외한 거의 모든 부분은 완벽히 이해하였다. 이번 프로젝트를 진행하면서 만족한부분, 부족했던부분, 해결해야할 부분을 정리해보고자 한다. 먼저 만족스러운 부분이다.팀원간의 소통이 원활했다.팀으로 이루어지는 프로젝트이다보니, 팀원간의 소통이 원활해야만 프로젝트 진행상황이나, 어려움은 없는지를 체크하여 큰 문제를 사전에 방지할 수 있기 때문에 매우 중요하다. 다행히도 팀원분들이 소통을 잘해주셔서 소통으로 인한 문제는 적었다고 생각한다.아이디어를 잘 내주셨다.팀명이나 멤버카드의 데이터나, 기능에 대한 아이디어를 잘 내주셔서 처음 기획했을때보다 조금 더 이쁘게 페이지가 마..

2차 공부/TIL 2024.07.19

n^2 배열 자르기

프로그래머스 - n^2 배열 자르기  먼저 작성한 코드function solution(n, left, right) { var answer = []; let answerStr = '' for (let i = 1; i Number(el));}// i일 때 i를 i개만큼 넣고, n까지 1씩 더하며 추가// [1 2 3 4]// [2 2 3 4]// [3 3 3 4]// [4 4 4 4]만드려는 배열을 문자열로 만들고 한 문자열에 모두 저장한 다음, left와 right에 맞춰 자르고, 배열화시킨 뒤 모든 요소를 숫자화 시키는 방식으로 풀이했다.테스트코드는 모두 성공했으나, 데이터가 매우 크게 들어올 수 있는 점을 생각하지 않아 시간초과로 실패하였다. 두번째로 작성한 코드function ..

24.07.18 async try {await} catch() / Promise

어제 너무 긴 html파일의 style, script를 분리하여 모듈화 시켰다.한 html에서 변수에 데이터를 저장하여 해당 데이터를 특정 기능에서 사용할 때에는 문제가 없었지만, 모듈화를 시켜 어떤 데이터를 다른 모듈에서 사용할 때 오류가 발생했다. 페이지의 멤버데이터는 firebase에 수동으로 저장해두었고, 해당 데이터를 페이지가 불러와지고 난 뒤 처음 한번만 데이터를 GET하여 memberArray에 저장하고, memberArray를 필요한 곳에서 사용해야했다. import { initializeApp } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-app.js"; import { getFirestore, colle..

2차 공부/TIL 2024.07.18

괄호 회전하기

프로그래머스 - 괄호 회전하기  먼저 작성한 코드function solution(s) { var answer = 0; let closerObj = { '[' : ']', '{' : '}', '(': ')' } for (let i=0; i { if (closerMap[key] !== 0) { flag = false } }) if (flag) {answer++}; } return answer;}반복에따라 회전한 문자열 targetStr의 한 단어마다 어떤 괄호인지 검사하여 closerMap의 해당 괄호의 닫는괄호에 닫아야하는 개수를 더하거나 뺀다.만약 타겟단어가 닫는괄호인데, 객체에서..

24.07.17 미니프로젝트 script, style 모듈 분리하기 / try{...} catch(err){...}

한 html에서 5명이 작업을 하다보니, 아래와 같이 script와 style태그가 엄청나게 길어졌다.  그래서 내가 작성한 style과 script들을 모듈화 시켜 분리작성해볼 생각이었다.한 html파일내에서 다양한 기능과 다양한 view들이 작업되다보니 git관련 문제들도 많았고, 코드가 길어져 가독성이 떨어지므로 가능한 최소단위의 기능별로 모듈화시키기로 결정했다. 먼저 쉬운 style분리부터 진행하였다. 모달관련 style태그를 modal.css라는 파일을 생성하여 그곳에 몰아놓고,  index.html의 head에서 아래와 같이 해당 파일을 css로 불러왔다.다행히 오류없이 정상작동하였다. 다음으로 script를 모듈화 시키는 것이었다. html파일에서 script를 모듈화 시켜본 적이 없어 예시..

2차 공부/TIL 2024.07.17

24.07.16 미니프로젝트 troubleshooting

한 페이지에서 조를 소개하는 화면이 먼저 보인다. 소개하는 부분의 바로 아래에는 아래를 향하는 화살표가 존재하며직접 스크롤을 내려도 간단한 멤버소개카드가 모여있는 곳으로 이동 가능하며, 화살표를 클릭해도 해당 부분으로 화면을 이동시킨다. 멤버 소개 데이터는 Firebase에 직접 데이터를 미리 집어넣었다.이전에는 데이터 형태가 같은 임시데이터를 변수에 담아 사용했는데, 세팅때부터 firebase를 세팅하여 해당 데이터로 연습하며 페이지를 만드는게 두번 일을 하지 않고 더 나을 것이라는 충고를 듣고 변경했다. 또한 각각의 멤버 카드에는 각 멤버들의 이름, 소개, 댓글목록이 간략히 보이며 소개 혹은 댓글목록을 클릭하면 상세한 내용이 나오는 모달창이 등장한다. 모달창 배경은 흐리게 처리가 되어있으며 배경은 클..

2차 공부/TIL 2024.07.16

24.07.15 Git / Github

Git 이란 무엇일까?Git이란 분산 버전관리 시스템으로 컴퓬터 파일의 변경사항을 추적하고 여러명의 사용자들 간에 파일에 대한 작업을 조율하는데 사용되는 프로그램이다.쉽게말해 코드의 변경점을 기록하는 것이다.git으로 코드의 변경점을 기록한 것을 Github이라는 곳에 올려 타인과 공유하고, 개인적으로 백업을 진행하는 것이다.그러므로 Github은 백업과 공유가 가능한 온라인 코드 저장소이다. 다음으로 git 명령어를 조금 알아보고자 한다.먼저 git bash에서 필수로 사용되는 명령어를 알아보자. 내가 만약 numMemo라는 html파일을 깃허브에 올려 백업해두고자 한다.그렇다면 터미널을 열어 git bash를 키고, num Memo가 존재하는 폴더로 이동해야한다.현재는 code라는 폴더에 있지만, n..

2차 공부/TIL 2024.07.15