javascript

이전 바닐라 JS 프로젝트에서 배경화면을 변경하여 나만의 앱을 생성해보겠습니다. 정적인 화면을 구성하는 index.html 에서 배경화면 처리를 위한 script를 등록하겠습니다. index.html에서 weather.js 를 등록해줍니다. index.html bg.js image는 총 3장을 준비하였습니다. 오리 3총사 image 객체를 생성하고 나면 css의 선택자 class를 포함시키고, body 태그에 해당 tag 를 prepend 하게 됩니다. body 안에 image 가 잡히게 됩니다. (css에서 z-index = -1 로 잡았기 때문에 현재 맨 뒤로 가있는 상태입니다.) 이 다음 코드인 weather.js 구현해야 하는데 현재 위치 좌표를 받아오지 못하고 있다. mac에서 위치 좌표를 설정..

바닐라 JS 공부를 시작하면서, 노마드 코더에서 제공하는 바닐라 JS로 크롬웹 만들기를 트라이 해보았습니다. Directory 구조 우선 가장 베이직이 되는 index.html 부터 살펴보겠습니다. html의 구조는 head, body 로 이루어져 있습니다. stylesheet에 포함되어 있는 index.css 로부터 css 값을 읽어와 html이 web의 DOM에 업데이트 하게 됩니다. index.html 보통의 경우에 아래와 같이 많이 사용하게 됩니다. HTML Foramt 여기서 div tag를 이용해 웹 상에 움직이는 시계를 트라이 해보겠습니다. 첫번째 구현 항목은 web으로 동작하는 시계를 만들어보는 것입니다. Redering 화면 ⏤ 1 위 렌더링 화면을 구성하기 위해서 아래 html, js를..

Javascript로 두 문제를 풀어보았습니다. 관련해서 Javascript 문법이나 특이점을 정리해보고자 합니다. 1) 완주하지못한선수 HashMap을 사용해서 해결할 수 있는 문제였는데 Javascript에서 HashMap을 정의할 때 아래와 같이 사용합니다. HashMap에 데이터를 삽입한 후 for loop으로 데이터를 조회할 때에는 아래와 같이 사용합니다. 이 문제에서는 특별한 로직이 필요없습니다. 여러 풀이법이 있겠지만 HashMap을 이용하면 쉽게 접근할 수 있습니다. Code 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 function solution(participant, completion) { var ans..

javascript에 익숙해지기 위해 관련 언어를 서칭하며 문제를 해결해 보았습니다. 관련 문제는 2021 KAKAO BLIND RECRUITMENT 신규아이디추천 입니다. 정규식을 알아야 풀 수 있는 문제라고 접근했는데 서치해보니 문자열의 각 문자를 참조할 수 있는 방법에 대해 공부할 수 있었습니다. MDN Web Docs에서 관련 내용을 참고해보면 ThecharCodeAt()method returns an integer between0and65535representing the UTF-16 code unit at the given index. 로 소개되어있습니다. 즉, Unicode로 반환되기 때문에 우리가 은히 알고있는 아스키 코드표를 참고해서 비교해봄으로써 문제에서 요구한 사항을 지켜낼 수 있습니..

l.빠르게 시작하기 test1.js function testFunction(){ ... } let testVariable; module.export = { testFunction, testVariable } test2.js let testFunction = require('./test1.js').testFunction; let testVariable = require('./test1.js').testVariable; ll.모듈 Javascript에서 export 문은 함수, 변수를 다른 .js로 내보낼때 사용하게 됩니다. lll.설명 MDN 에서 나와있는 방법이 정석입니다. ES Module은 ECMAScript 의 표준입니다. 예전에는 CommonJS 을 사용했습니다. 현재 브라우저에서 가장 큰 특징중..