회고록 블로그

※ 필자는 초보자입니다. ※ 틀린 내용은 언제든지 피드백 부탁드립니다. ? "HTML 엘리먼트인 는 캔버스 스크립팅 API 또는 WebGL API와 함께 사용해서 그래픽과 애니메이션을 그릴 수 있다." 쉽게 정리를 하자면 는 웹 페이지에 그래픽을 그리는데 사용을 하는 요소이다. 다만, 라는 엘리먼트는 그래픽의 컨테이너일 뿐이고, 실제로 그래픽을 그리는 것은 JavaScript가 해야한다. (CSS 아님) 즉, JavaScript를 사용한다는 말이다. (참고자료 : 출처1, 출처2) 사용 방법 우선 HTML 문서에 엘리먼트를 추가해야한다. /* 예제 */ 캔버스의 내용을 설명하는 대체 텍스트 width, height 어트리뷰트(attribute; 속성)이 있으며, 기본값은 다음과 같다. width 기본값 ..

https://chicpro.dev/vs-code%EC%97%90%EC%84%9C-git-%ED%9E%88%EC%8A%A4%ED%86%A0%EB%A6%AC-%ED%91%9C%EC%8B%9C-%EC%98%A4%EB%A5%98/ VS Code에서 git 히스토리 표시 오류 – CHICPRO chicpro.dev 나 역시 위와 같은 문제에 부딪혔다. 그런데 심볼릭 링크를 걸어둔 것도 없는데 왜 이러나 싶었는데 프로젝트 폴더의 상위 폴더에서 git init을 해서 그런것이었다.. 나 같은 경우는, 쉽게 비유를 해보자면 마치 C 드라이브에 .git을 만들어두고, 그 밑에 workspace에 또 .git을 만들어 놓은 격... 그래서 C 드라이브에 있던 .git을 지워주었더니 잘 동작하였다. 바보가 따로 없다

※ 필자는 초초초보입니다. 틀린 내용은 언제든지 댓글 등 부탁드립니다. 모던 자바스크립트 Deep Dive 책 읽다가 히든 클래스에 대한 언급이 잠깐 나와서 한번 찾아봤다. ✅ V8 엔진 위키백과에 따르면 구글에서 개발한 자바스크립트 엔진이며, 웨 브라우저를 만드는데 기반을 제공하는 오픈 소스 자바스크립트 엔진이라고 한다. 구글 크롬 브라우저와 안드로이드 브라우저에 탑재되어 있고, Node.js 또한 크롬 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임이다. V8 공식 사이트에서는 다음과 같은 특징이 있다고 한다. - V8 엔진은 C++로 작성되었다. - 고성능 자바스크립트, 웹어셈블리어 엔진이다. - 크롬 및 Node.js 등에서 사용된다. ✅ 동적 타이핑 언어 자바, C++과 같은 클래스 기반 ..

※ 필자는 초초초보자입니다. ※ 틀린 내용에 대한 피드백은 언제든지 환영합니다. 자바스크립트 코드에서 자주 보는 점 3개(three dots)에 대해서 정리 공식 명칭은 전개구문(spread syntax)이다. ECMAScript6(2015)에서 새로 추가된 문법이다. 배열이나 문자열과 같이 반복 가능한 문자를 (함수로 호출 할 때) 0개 이상의 인수 또는 (배열 리터럴 일 때) 요소로 확장하여 0개 이상의 키-값의 쌍으로 객체를 확장시킬 수 있다. [구문] - 함수 호출 시 인자로 전달 myFunction(...iterableObj); - 배열 리터럴과 문자열 [...iterableObj, '4', 'five', 6]; /* const arr = ['A', 'B', 'C']; console.log("-..

※ 필자는 초초초보자입니다. ※ 틀린 내용에 대한 피드백은 언제든지 환영합니다. 공부하고 있는 자료 : modern JavaScript tutorial https://ko.javascript.info/iterable iterable 객체 ko.javascript.info ✅ iterable 객체 - 반복 가능한 객체 : iterable 객체 - 배열을 일반화한 객체이다. ► iterable 객체의 대표적인 예가 [배열], [문자열]이다. - 이 이터러블 이라는 개념을 사용하면 for...of 반복문을 적용할 수 있다. - 이터러블을 배우는 이유는 배열이 아닌 객체라도 어떤 것들의 컬렉션(목록, 집합 등)을 나타내고 있는 경우 for...of문을 적용할 수 있으면 컬렉션을 순회하는데 편하기 때문이다. /*..

※ 필자는 초초초보자입니다. ※ 틀린 내용에 대한 피드백은 언제든지 환영합니다. 공부하고 있는 자료 : modern JavaScript tutorial https://ko.javascript.info/array-methods 배열과 메서드 ko.javascript.info ✅ 요소 추가.제거 메서드 - 배열의 맨 앞이나 끝에 요소 추가/제거하는 메서드 (앞에서 공부함) ► pop : 배열 뒤에서 꺼냄 / push : 배열 뒤에 넣음 ► shift : 배열 앞에서 꺼냄 / unshift : 배열 앞에 넣음 - 이 외에도 다른 메서드가 있다. ► splice : 배열에서 요소를 추가/삭제/교체한다. ► slice : 첫번째 인자부터 두번째 인자까지의 요소를 복사한 새로운 배열을 반환한다. ► concat :..

※ 필자는 초초초보자입니다. ※ 틀린 내용에 대한 피드백은 언제든지 환영합니다. 공부하고 있는 자료 : modern JavaScript tutorial https://ko.javascript.info/array 배열 ko.javascript.info ✅ 배열 - 객체는 기본적으로 순서를 고려하지 않고 만들어진 자료구조이므로 기존의 프로퍼티 사이에 새로운 프로퍼티를 끼워넣는 등이 불가능하다. - 이럴 때 사용하는 자료구조가 배열이다. ✅ 배열 선언 let arr1 = new Array(); let arr2 = []; - length를 사용하면 배열에 담긴 요소가 몇 개인지 알아낼 수 있다. - alert을 사용하면 전체 요소를 출력할 수도 잇다. - 배열 요소의 자료형엔 제약이 없다. 📌 trailing ..

※ 필자는 초초초보자입니다. ※ 틀린 내용에 대한 피드백은 언제든지 환영합니다. 공부하고 있는 자료 : modern JavaScript tutorial https://ko.javascript.info/string 문자열 ko.javascript.info ✅ 문자열 - 페이지의 인코딩 방식과 상관없이 자바스크립트에서 문자열은 UTF-16 형식에 따른다. - 작은따옴표, 큰따옴표, 백틱으로 문자열을 감쌀 수 있는데 백틱은 감싼 문자열 중간에 표현식을 삽입할 수 있다. (= 템플릿 리터럴이라고 부른다) ► 백틱은 여러 줄에 걸쳐 작성할 수도 있다. - 템플릿 함수에서도 백틱이 사용된다. ► 백틱 바로 앞에 함수 이름을 쓰면 백틱 안의 문자열 조각/표현식 평가 결과를 인수로 받아 함수가 호출된다고 한다. fun..

※ 필자는 초초초보자입니다. ※ 틀린 내용에 대한 피드백은 언제든지 환영합니다. 공부하고 있는 자료 : modern JavaScript tutorial https://ko.javascript.info/number 숫자형 ko.javascript.info ✅ 숫자 입력하기 - e 를 이용하는 방법이 있다. "use strict"; let num1 = 1e9; let num2 = 1e-6; console.log(num1); //1000000000 console.log(num2); //0.000001 - 16진수 : 0x - 8진수 : 0o - 2진수 : 0b - 16, 8, 2진법 외의 진법을 사용하려면 parseInt를 사용해야한다. ✅ toString(base) - num.toString 메서드는 bas..

※ 필자는 초초초보자입니다. ※ 틀린 내용에 대한 피드백은 언제든지 환영합니다. 공부하고 있는 자료 : modern JavaScript tutorial https://ko.javascript.info/primitives-methods 원시값의 메서드 ko.javascript.info ✅ 원시값의 메서드 - 일단 확실하게 한 가지 정리할 것이 있다. "원시값은 객체가 아니다." - 원시값에도 객체처럼 메서드를 호출할 수 있지만, "원시값은 객체가 아니다" - 원시값 vs 객체 ► 원시값 : 원시형 값이며 종류로는 [문자 / 숫자 / bigInt / 불린(boolean) / 심볼(symbol) / null / undefined 형](7가지)이 있다. ► 객체 : 프로퍼티에 다양한 종류의 값을 저장할 수 있으..