javascript

[Javascript] const 변수 push(), pop()

개발 중, 배열1에서 배열2로 각 요속들을 옮기는 코드에서 당연히 let으로 빈 배열을 선언했는데, eslint error가 났다. push하는 코드가 있는데 왜 경고가 나지? const는 값 변경이 불가능한 것 아니었나? 라는 생각이 들었다. 하지만, const로 선언하고 push(), pop()을 해도 잘 동작한다. 이유를 찾아보니, const는 선언과 동시에 할당이 이루어질 때 사용하는 것으로, 재할당이 불가능하다는 특징이 있는데 push(), pop()의 경우 배열을 다른 값으로 교체하는 것, 재할당하는 것이 아닌, 기존 배열 원본을 수정하는 것이므로 가능하다는 것이다. 배열은 포인터로 선언이 되어있는데, push, pop은 포인터를 바꾸는 것이 아닌 같은 포인터의 값만 변경시키는 것이다. +덧붙..

[Javascript] setInterval 바로 실행하기

setInterval 함수는 인자로 받은 함수를 특정시간마다 실행시키는 함수이다. 즉시 실행되지 않고 먼저 기다린 뒤 특정 시간 간격으로 실행된다. setInterval(console.log("hello world"), 10000); // 1000 = 1초 // 10초 뒤 hello world 출력 // 20초 뒤 hello world 출력 // 30초 뒤 hello world 출력 // ... 하지만, 먼저 실행을 시키고 일정간격으로 동작시키고 싶을 때가 있다! 그럴땐 아래처럼 코드를 두 줄로 써도 가능하지만, 실행하는 함수가 중복이 된다. 아래 코드의 경우 console.log("hello world")가 중복이다. console.log("hello world") setInterval(console...

switch문 OR연산하기

switch문을 쓸때 case부분을 OR 연산하고 싶을때 switch(value){ case 1: case 2: // do something break; ... } 이렇게하면 value가 1 또는 2인 경우에 실행이 된다!

[Spring Boot][Firebase] FCM설정 시, Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker for scope ~

바쁘신 분들을 위한 해결책 요약 firebase-message-sw.js 경로 확인 -> resources/static 경로에 있어야합니다!!!! https적용 여부, 나는 http://localhost에서도 1번 해결책만으로 위 오류는 없어졌지만, https에서만 된다고는 하니, 안된다면 시도해보길! 이슈 음~ 아까 생긴 오류 해결한지 30분도 안되서 오류 하나 추가요... 너무 좋다~~🙃🙃 FCM테스트 하려고 하는데 Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker for scope ~ 검색해보니 http에서 이런에러가 난다길래, https적용된 도메인에 올려서 다시 테스트..

[Node.js][Express] alert 창 띄우고, 페이지 이동하기

alert창 띄우고 페이지 이동하기 res.write(""); res.write(""); javascript를 이용하면 가능하다 response로 데이터를 띄우는게 아닌, alert창을 띄우고 location을 설정해주면 된다! 페이지만 이동하기 return res.redirect("../view/notices") alert 사용 없이 redirect만 시킬거라면 위 코드도 사용가능하다

[Vue.js]5.배열,v-for,v-if,테이블,셀렉트박스 사용하기

지난번 포스팅에 이어서 template, script 부분을 다뤄보겠습니다. 1. 배열 data부분에 배열을 추가할 수 있습니다. data() { return { name: "subari", input: "text", options: [ { v: "R", t: "Red" }, { v: "B", t: "Blue" }, { v: "G", t: "Green" }, ], color: "R", }; }, 이 배열을 순회하기 위해서, vue에는 반복문 역할을 하는 v-for가 있습니다. v-for="(d, i) in options" python의 for i in n 과 비슷한 문법입니다. options 배열안에서 반복문이 돌아가고, d는 data, i는 index를 나타냅니다. 현재 배열의 한요소는 v, t 두가지..

[Vue.js]4.data, click, methods 사용하기

지난 포스팅에 이어서 이번에는 vue에서 data, event 등을 다루는 법을 알아보겠습니다. 1. data 다루기 Home.vue에서 export default 내부에 data() { return }를 추가해주고 return 뒤에 원하는 데이터를 { key : value } 형태로 넣어주면 됩니다. 그리고 그 데이터를 사용하기 위해서는 부분에서 {{ key }} 와 같이 중괄호 두개를 이용하여 추가해주면 얘는 key의 value에 해당하는 부분이 화면에 나타나게 됩니다. About.vue About {{ name }} 2. input html에서 value에 해당하는 것을 vue에서는 v-model로 사용할 수 있습니다. data 부분에 input 데이터를 추가하고 v-model 뒤에 ""을 이용하여..

[Vue.js]2.vue-router 사용하기

이번 글에서는 vue-router를 통해 라우팅기능을 구현해보겠습니다. vue-router설치 먼저, vue-router를 설치해야합니다. npm i vue-router --save 설치 후 App.vue 파일의 template 부분에 router-view 부분을 추가해주세요 이 부분이 path에 의해 바뀌는 view가 보여질 위치입니다. App.vue 이제 여기에 보여질 view페이지를 추가해줘야겠죠?? src폴더 안에 views라는 폴더를 만든 뒤, 그 안에 Home.vue, About.vue 파일을 만들어보겠습니다. Home.vue Welcome! About.vue About Page vue 파일은 기본적으로 html에 해당하는 template 부분과, script 부분으로 이루어진 구조를 가집니다..

[Vue.js]1.Vue개발환경 세팅

먼저, npm사용을 위해 node.js 설치를 진행해주세요.window, mac 환경 둘다 아래링크에서 Lts버전 다운로드 해주시면 되고, mac은 homebrew이용해서 다운 추천드립니다.링크이용하여 다운 시 환경변수 설정이 필요합니다! 자세한건 구글에...nodejs.org/ko/ 에디터로는 vscode 사용하였습니다. 원하는 위치에 폴더를 생성해주시고그 폴더를 에디터에서 열어주세요. 윈도우는 window + R 로 실행을 열고 cmd를 검색하여 열어주시고맥은 터미널을 열어주세요cd [폴더명] 으로 아까 만든 폴더 위치로 이동해주세요 1. vue cli 설치npm install -g @vue/cli 2. vue 폴더 생성vue create [폴더명]ex) vue create test 추가적으로 필요한..

[Node.js]nodejs로 웹서버 만들기

nodejs로 helloworld를 출력하는 웹서버를 만들어보겠습니다. window환경에서 진행하였고 에디터로는 vscode이용하였습니다. const http = require('http'); const server = http.createServer((req, res) => { res.statusCode = 200; res.end('Hello, World!\n'); }); server.listen(3000); 정말 딱 최소한의 코드로만 작성한 hello world출력하는 서버입니다! 이 코드를 js파일을 만들어서 입력하여 저장해주세요. nodejs를 실행시키는 방법은 코드를 작성한 뒤 cmd창을 열어 해당 파일 위치로 이동해서 ->cd 파일경로 ->node 파일이름.js 입력해주시면 해당파일이 실행됩니..