자바스크립트 4

[javascript] 빈객체 if문으로 확인하는 방법 ({} check / Object.keys 주의사항)

자바스크립트에서 default 객체를 선언하는 방법은 아래와 같다. const obj = {}; 이후 로직에서 obj 객체에 key,value가 세팅이 되었는지 아닌지 체크하는 방법이 필요해서 찾아보게되었다. 🧡Object.keys 이용하기 Object.keys()를 이용하면 주어진 객체의 key 이름을 배열로 반환한다. Object.keys(obj) //빈객체일 경우 [], key가 있는경우 [id,name] 해당 기능을 이용해서 if문처리가 가능하다. 예시코드 let obj = {} obj ={ id:1, name:one } if(Object.keys(obj).length !== 0) { alert("빈객체아님!") } 위 예시로 빈객체인지 아닌지 확인이 가능하다! ✅사용시 주의사항 만약 obj객체에..

FrontEnd/Javascript 2022.07.19

[자바스크립트] 세미콜론(;)을 꼭 안찍어도되는 ASI 알아보기

✔️자바스크립트의 세미콜론(;) 자바스크립트에서는 세미콜론을 찍어주는 이유는 내가 쓰는 구문이 종료가 되었다 라는 의미이다. 프로그래밍 문법에 맞게 작성한 코드를 적고 해당 코드가 완료되면 그 뒤에 종료가 되었다는 의미로 세미콜론을 찍어준다. let a = 1; console.log(a); 하지만, 개발을 하다 보면 세미콜론을 정확히 찍을 때도 있지만, 개발을 하다보면 세미콜론을 까먹고 안 찍는 경우도 있다. 하지만 보통 세미콜론을 안찍어도 오류가 난적이 없다! 그런데도 꼭 세미콜론을 찍어야하는건가? 하지만 오류가 안나는 이유는 바로 ASI 때문이다! 🎇ASI(Automatic Semicolon Inserion, 자동 세미콜론 삽입) ASI는 자바스크립트 엔진에서 자동으로 ASI를 찍어주는 기능이 있기 ..

FrontEnd/Javascript 2022.04.11

[Javascript] Math 객체를 이용해서 랜덤 값 만들기(Math.random)

🤔Math 객체란? Math객체는 자바스크립트에 내장되어 있는 객체이다. 주로 숫자를 다루는 수학에 관련된 함수들이 들어가 있다. 그중 오늘은 내가 자주 사용하는 Math.random()에 대해 공부하겠다. 📈Math Random 함수를 사용할 때 대시보드나 그래프를 그려줄 때 가끔 데모 사이트를 만들 때 랜덤 값들이 필요한 경우가 있다. 이럴 때 나는 주로 Math.random()을 이용해서 특정 범위의 랜덤 값을 만들어서 연동한다. 📕Math Random 이용하기 실행화면 실행을 해보면 알겠지만 0 이상 1 미만이 난수를 발생해준다. 1️⃣최소 최대값 사이의 난수 생성하기 0,1 사이 난수가 아니라 가끔은 내가 원하는 정수의 난수가 필요할 때도 있다. 이때는 min과 max 값을 설정해서 아래와 같이..

FrontEnd/Javascript 2022.03.14

[nuxt/vue filter] 숫자 3자리(천자리) 마다 콤마 찍으면서 소수점 처리하기

자바스크립트에서 천 자리마다 콤마를 찍어줘야 하는 경우가 많다. 숫자에다가 천 자리마다 콤마를 찍기 위해서는 정규식을 이용해야 한다. Vue에서는 Filter를 이용해서 숫자 3 자리 마자 콤마를 찍는 게 가능하다. example.vue {{price | numberFormat(2)}} 예시 코드이다. vue filter를 이용해서 numberFormat이라는 filter를 만들어준다. 두 번째 인자로 toFixed를 이용해서 소수점을 잘라준다. 나의 경우 2를 넣어서 소수점을 2자리까지 표시해준다. price에 들어간 342345.10923이라는 숫자가 vue filter를 통해서 소수점이 2자리까지 잘리고 그 이후 정규식을 이용해서 3자리마다 콤마를 찍어주게 된다. 이처럼 간단하게 vue filter..

FrontEnd/Vue.js 2021.12.17