본문 바로가기

프로그램 강좌

[javascript]Array.of 에 관한 실험 Array.of에 관해서 알아보겠습니다. Array.from은 많이 썼는데, Array.of는 다소 생소하게 느껴집니다. 몇가지 실험을 해보겠습니다. console.log([1,2,3,"haha", 23*9]); //[1, 2, 3, "haha", 207] Array.of를 사용해보겠습니다. console.log(Array.of(1,2,3,"haha",23*9)); //[1, 2, 3, "haha", 207] 외관상 보기에는 동일하네요. type비교 그럼 같은 타입일까요? function getType(n) { if (typeof n === 'object') { if (n.constructor === Array) n = 'array'; } return n; } const a = Array.of(1, 2,.. 더보기
gh-pages 배포하기 #1 설치 터미널에서 아래 명령어를 실행시켜 줍니다. npm i gh-pages 설치하고 나면 package.json에서 몇가지 셋팅을 변경해야 합니다. /package.json "homepage": "https://유저네임.github.io/저장소명", *** "scripts": { "predeploy": "npm run build", "deploy": "gh-pages -d build", *** }, gh-pages -d build에서 build는 빌드됐을때의 폴더명입니다. 폴더명이 뭔지 확인을 해보려면 npm run build를 해봅니다. 저는 build라고 폴더가 생겼네요. 따로 변경하진 않아도 되겠군요. script쪽에 명령어를 추가했고, github에도 설정을 확인하겠습니다. 내가 gh-pages를.. 더보기
[Util]JSON view json 파일을 실행시켰는데, 정렬이 잘 안되어서 보기 불편하면 이 익스텐션을 쓰면 간단히 해결됩니다. JSON view 설치 설치를 해보겠습니다. 설치 전 파일이 이런 형태로 보였다면 설치 하자마자 이렇게 보입니다. 정렬되어 있어 확인하기 간편합니다. 아주아주 간단히 해결되었습니다. 다음 포스팅에서 또 뵙겠습니다. 더보기
[html]favicon 만들기 & 코딩 방법 파비콘 코딩하는 방법은 사실 너무 간단해서 블로그 할 것도 없긴 합니다. HTML 내 header 영역에 선언만 해주면 되거든요. 이대로 끝내면 좀 그러니까 더 쉽게 만들수 있는 방법을 알려드리겠습니다. 파비콘 더 쉽게 제작하기 디자이너가 파비콘 코딩해달라고 건냈는데, 어마어마하게 큰 크기입니다. 게다가 확장자도 ico가 아닌 jpg... 그냥 직접 수정합시다. 우린 어떻게든 해결해야하니까 직접 변환하는 방법을 알려드리겠습니다. https://convertico.com/ 사이트 접속하시면 딱봐도 이 부분에 이미지를 드래그 해야할것 같습니다. 이미지를 드래그한 후, Choose Icon Layer Sizes를 눌러 원하는 크기를 설정해줍니다. 저는 파비콘에 필요한 사이즈 16x16으로 선택해줬습니다. 저장.. 더보기
[javascript]스크롤시, 오디오 자동재생 특정 스크롤 영역을 지날때 오디오를 재생하게끔 하는 요청이 들어왔습니다. 테스트를 위해 짜본 코드 공개합니다. html javascript var audio = new Audio('오디오파일.mp3'); //저작권 문제로 오디오 파일은 지웠습니다. //audio.play(); $(window).scroll(function () { var position = $(window).scrollTop(); $('#info').innerText = position; if (position > 100) { console.log('detect'); audio.play(); } }); 스크롤로 100px 영역을 지날때 자동적으로 사운드가 재생됩니다. 재생 되더라도 버튼으로 제어도 가능합니다. 더보기
[javascript]Continue, Break, Return 정리 프로그램 작성하다보면 몇가지 헷갈릴 수 있는 부분들이 있어 정리합니다. Break; 가장 가까이에 있는 반복문을 벗어나기 위해 쓰는 명령어 입니다. Return; 함수를 벗어나기 위한 명령어 입니다. 만약 return 어쩌고 하면 그 값은 반환한뒤 종료합니다. Continue; 반복문을 완전히 빠져나가진 않고, 반복문 내의 작업문을 건너뛸때 사용합니다. 반복후 다음작업 이라고 생각하면 좋습니다. 더보기
[Excel]countA, countIF 사용하는 방법 가끔 통계를 내야할때 엑셀을 씁니다. 늘 쓰는건 아니지만 간단한 확인 or 시뮬레이션이 필요할때 애용합니다. 코딩하는것 보다 빠르니까요. 회원수 통계내기 이런 표가 있다고 있다고 가정해봅시다. 총 회원수 구하기 countA 이 중에서 총 회원수가 알고 싶다면 이렇게 하면 됩니다. =countA(E16:E25) 채워진 셀을 모두 카운트 해줍니다. 결과는 6입니다. 맞나요? 지급된 회원수 countIF =countIF(G16:G25, "완료") 결과는 3이라고 나오겠죠? 미지급된 회원수 countIF 한번 해봤으니 더 쉬우실겁니다. =countIF(G16:G25, "지급예정") 결과는 2입니다. 취소된 회원수 countIF 이젠 어떻게 할지 감이 오시죠? =countIF(G16:G25, "취소") 결과는 1.. 더보기
[javascript]parseInt 정수 처리 javascript에서 정수로 바꾸는 방법은 저번에 다뤘던 Math.floor/round/ceil을 하면 되는데, 한가지 더 다뤄볼게 있습니다. parseInt(number) 사용방법은 아주 간단합니다. 바꾸길 원하는 수 혹은 변수를 parseInt로 싸주면 됩니다. 반올림은 안됩니다. 그래서 Math.floor 랑 비슷한 편인데, 아주 똑같진 않습니다. 예제를 통해 설명하겠습니다. 예제 let a = 2.2; console.log(parseInt(a), Math.floor(a)); // 2, 2 let b = 2.6; console.log(parseInt(b), Math.floor(b)); // 2, 2 let c = 3; console.log(parseInt(c), Math.floor(c)); // .. 더보기