본문 바로가기

전체 글

 (64)
TIL no.25 - 특정 값을 가지고 있는지 알아내는 메소드 : hasOwnProperty(), in JavaScript hasOwnProperty() 메소드는 객체가 특정 프로퍼티를 가지고 있는지를 나타내는 함수로 불리언 값(true 나 false)을 반환한다. const obj = {}; obj.age = 29; console.log(obj.hasOwnProperty('age')); object 안에 해당 property 가 있는지를 알아내는 메소드로 위의 코드는 true 를 return 합니다. includes() 메소드는 배열이 특정한 값을 가지고 있는지를 나타내는 함수로 불리언 값을 반환한다. const arr = [1, 2, 3]; console.log(arr.includes(2)); array 안에 해당 값이 존재하는 지를 알아내는 메소드로 위의 코드는 true를 return 합니다. indexOf() 메소드는..
TIL no.24 - CRA 무엇인가, 어떻게 ? 지난 블로그 편에서 작성했던 리액트 정리에서 다루었던 CRA 에 대해서 간단하게 정리해보려고 합니다 ! CRA (Create-React-App) UI 기능만을 제공하는 리액트는 이와 같은 이유때문에 프레임워크가 아닌 라이브러리로 정의되고 있습니다. 따라서 개발자가 직접 구축해야 하는 것이 많아 처음 시작하는 개발자에게 초기 설정이 어렵게 다가올 수도 있습니다. 리액트에서 이러한 어려움을 해결하기 위해 CRA 라는 것이 생겨났습니다. CRA는 리액트로 웹 애플리케이션을 만들기 위한 환경을 제공하며 이것을 이용한 명령어 하나로 리액트의 개발환경을 구축할 수 있습니다. 리액트 초기설정 시 기초적으로 필요한 환경을 제공해주고 후에 새로운 기능을 추가했을 때 새로운 패키지 버전만 업데이트 해주면 됩니다. CRA ..
TIL no.23 - 배열 반대로 뒤집는 함수 Array.reverse() * split(), join() 활용 : JavaScript Array.prototype.reverse() 는 배열의 순서를 반대로 리턴하는 메소드입니다. 예시를 사용해서 어떤 식으로 사용가능 한 지에 대해 이해해보고 활용해보도록 하겠습니다 !🏋🏼‍♀️ reverse() 는 오직 배열만을 뒤집은 반대 순서대로 정렬하여 재배열하는 메소드입니다. 그렇기 때문에 위와 같은 arr 배열을 reverse() 한다면 , 바로 위와 같은 결과를 리턴합니다. -> 배열의 순서를 반대로 재정렬하고 싶을 때 사용합니다. arr 자체에 reverse()를 사용하면 반대로 재정렬 된 arr를 리턴합니다. arr 자체의 값을 바꾸지 않을 것이라면 반대로 재정렬 된 arr의 값을 받을 다른 변수를 생성해주는 것이 좋습니다. ex) let arrReverse = arr.reverse() ;..
TIL no.22 - [React 1탄] Why React ?! html, css, javascript로 적은 양을 만들 때는 쉽고 재밌다고 생각했는데 점점 데이터 양이 많은 것을 만들게 되면서 react를 배워야겠다는 생각이 들었습니다. 웹의 복잡도가 높아지면서 생겨난 react라는 것의 편리함을 함께 느껴봅시다. Why React ? Vue, Angular 가 아닌 React를 먼저 배우게 된 이유는, 다른 프레임워크에 비해 사용자가 많아 생태계가 활성화 되어 있으며 접근성이 보다 쉽기 때문에 선택하게 되었습니다. What is React ? 리액트는 UI (User Interface) 를 만들기 위한 JavaScript Library입니다. 웹의 점점 더 복잡해지면서 DOM에 접근하여 JavaScript만을 통해 동적으로 구현하기란 다소 어려워졌습니다. 규모가..
TIL no.21 - document.createElement() : javascript로 html 태그 추가하기. wecode 과제로 westagram을 구현하면서 댓글 추가 기능을 할 때 유용하게 사용한 함수입니다. 이전에 제가 혼자 todolist를 만들 때도 사용했었습니다. document.createElement( ) - 자바스크립트에서 html에 태그를 추가하여 html구조를 생성하고자 할 때 사용합니다. const comment = document.createElement('li'); const userDiv = document.createElement('div'); const userName = document.createElement('a'); const userComment =document.createElement('span'); const heartImg = document.createElemen..
TIL no.20 - Object : JavaScript에서 빠질 수 없는 것. 음,, 자바스크립트 좀 안다 하면 절대 모를 수 없는 파트죠. 오브젝트 Object.. 처음에 기초부터 순서대로 javascript를 배웠을 때, object 란 그저 자바스크립트의 한 부분을 차지하는 줄 알았습니다 ㅠ (큰 오산..) 배우고 나서 돌아보니 javascript의 모든 것이 다 object로 이루어져 있더라구요,, 자바스크립트가 객체 지향 언어이다.. 객체 지향 언어이다.. 이론으로 외웠을 때는 안 와닿았던 말이 갑자기 떠오르면서...! 아ㅏ... 이래서 객체 지향 언어라 하는구나 .. 배우면서 알게 되었답니다.. 이론으로 배우기만 할 때는 간단하게 아..그렇구나! 로 넘어갔던 것들이 적용하면서 더 어렵게 다가왔습니다 ㅠ 그래서 더더욱 기록과 제 머릿속의 오브젝트들을 정리, 이해하기로 했답..
TIL no.19 - Scope가 무엇인가요? wecode에서 자바스크립트에 대한 레플릿이 끝나고 westagram이라고 instagram을 html, css, javascript를 이용해 사이트 클론하는 과제를 했는데요 ! 이 과제를 하면서 내 javascript 실력에 더 텅 빈 공허함을 느껴서,, javascript를 더 공부 해야겠다고 느꼇습니다. 하나하나 이해해야 할 파트별로 정리하면서 이해해보고자 합니다... 뼈,,,,저리게,,,,,,,,,,,🌟 SCOPE : 스코프란 정의된 각 상수나 변수 등의 요소들이 허용된 영역, 범위를 스코프라고 합니다. 보통 처음에 자바스크립트를 공부하면서 배울 때, 별로 중요한 이론이라고 생각하지 않았었는데.. javascript 코드를 짜면서 자꾸 * is not defined 라며 정의되지 않은 변수라고 뜨..
TIL no.18 - DataBase의 기초라도 이해합시다 ..!🌧 오늘은 DataBase에 대해 정리해보려고 합니다 ! 저는 Frontend-Developer 라서 제가 DataBase를 알아야 할 것이라고 생각 못했는데요.. 이해를 하고 있으면 Backend와 서로 소통하는데 더 원활하다는 이유이기 때문에 나도 기초를 이해하고 있어야 겠구나 ! 생각했습니다 🤗 깊이 파고들어 공부할 필요는 없겠지만 의사소통에 문제가 없게 이해하고 있는 것이 중요한 것 같습니다. Database 란 무엇인가요? 말 그대로 ! 데이터를 저장하고 보존하는 시스템을 말합니다. 저는 세션을 듣고 database를 공부하기 전에는 단순 분류로 저장된 데이터를 꺼내올 때 찾아서 꺼내온다고만 생각했었습니다. 하지만, database를 정리하기 위해서는 정규화라는 과정을 통해 미리 데이터들을 분류하..

티스토리툴바