본문 바로가기

Front-End/JavaScript

 (23)
[JavaScript] ios에서 new Date() ios(safari)에서는 new Date 형식을 고려하여 사용해야 한다.. 예를 들어 chrome에서는 new Date("2023.10.29")했을 경우 date형식으로 지정이 되지만 safari에서는 date형식으로 지정이 안 되어 getFullYear와 같은 함수를 사용했을때 NaN값을 가져오게된다 따라서 형식을 “YYYY-MM-DD HH-MM-SS" 또는 YYYY,MM,DD,HH,MM,SS 이렇게 맞춰주면 된다. https://github.com/SeonHyungJo/Tip-Note/issues/69 Safari에서 new Date()는 다르다? · Issue #69 · SeonHyungJo/Tip-Note모든 개발자 분들이 그런 건 아니지만, 날짜 관련 이슈에 대해 골머리를 썩으신 분들은 더 이..
[JavaScript] Math.random 취약점 대체 JavaScript에서 랜덤값을 구하기 위해서는 보통 0에서 1보다 작은 값의 부동소수점을 리턴해주는 Math.random()을 사용한다. ex) 0.4645817650490742 하지만 random함수는 실제로 랜덤값을 생성한다기보다 예상 가능한 난수인 유사난수를 생성하여 시스템 보안에 약점을 유발한다. 따라서 JavaScript에서는 암호학적으로 안전한 난수를 생성할 대체자로 Crypto를 사용하여 난수를 생성할 수 있다. crypto.getRandomValues() : 16비트, 32 비트등의 랜덤 숫자가 들어간 배열을 구할 수 있다. window.crypto.getRandomValues(new Uint32Array(1)); //32비트 랜덤 배열 1개, Math.random() 대체시 사용 win..
[JavaScript] 객체 값 비교 1. 순서가 보장되어 있는 경우 1) JSON.stringify(a) : a에 들어가는 객체, 배열 등 모든 값을 string으로 묶어준다. const obj1 = {nation: '한국', city: '서울'}; const obj2 = {nation: '한국', city: '서울'}; console.log(JSON.stringify(obj1)); //"{\"nation\":\"한국\",\"city\":\"서울\"}" console.log(JSON.stringify(obj2)); //"{\"nation\":\"한국\",\"city\":\"서울\"}" console.log(JSON.stringify(obj1) === JSON.stringify(obj2)); //true 2) Object.entries(ob..
[JavaScript] call, apply, bind 자바스크립트에서 함수를 호출하는 방법에는 기본적으로 사용되는 함수명 뒤에 ()를 붙여 호출하는 방법 외에 call, apply, bind를 이용하는 방법이 있다. this가 함수 호출식에 따라 객체를 가리켰다면 call, apply, bind는 함수의 this를 명시적으로 바인딩해 직접 실행문맥을 결정할 때 사용된다. 1. call func.call(thisArg[, arg1[, arg2[, ...]]]) - thisArg: func 호출에 제공되는 this의 값 - arg1, arg2, ...: func이 호출되어야 하는 인수 let person1 = { name: 'Jo' }; let person2 = { name: 'Kim', study: function(some) { console.log(this..
[JavaScript] 모듈 내보내기/불러오기 자바스크립트를 서버에서 사용할 수 있는 큰 이유 중 하나가 모듈화가 가능하기 때문이다. 그리고 이런 자바스크립트의 모듈화 명세를 만든 대표적인 그룹 중 하나로 Common.js가 있고 Common.js의 명세가 현재 node의 표준이 되어있다. node의 표준이 바로 require, module.exports()이다. 그런데 ES6로 넘어오면서 자바스크립트 자체에서 ES6 Module이라는 이름으로 모듈화를 지원하기 시작했고 그것이 import와 export이다. 1. Common.js 기반 모듈 내보내기/불러오기 1-1. 복수 객체 내보내기/불러오기 : 복수 객체를 내보낼 경우에는 exports 변수의 속성으로 할당한다. : 모듈을 가져올 때는 require()을 사용한다. //index.js cons..
[JavaScript] Node.js, NPM Node.js : 크롬의 v8엔진을 이용해 자바스크립트를 브라우저가 아닌 곳에서도 실행시킬 수 있게 해주는 자바스크립트의 실행환경 (Javascript's Runtime) NPM (Node Package Manager) : Node.js의 패키지 관리 도구 npm init : npm init 명령어를 통해 package.json파일 생성 : package name을 지정해 주고 이후 version, description, entry point 등 나오는 설정값들은 본인에 맞게 지정해 주거나 엔터를 클릭해 넘겨주면 자동으로 생성이 된다. package.json : 패키지의 정보를 기록하는 환경설정 파일 : 이름, 버전, 설명, 진입파일, 스크립트, 저자, 라이센스 등을 지정 : 진입파일은 여러파일 중 패키..
[JavaScript] 깊은 복사, 얕은 복사 JavaScript의 데이터 타입에는 2가지가 존재하며 타입에 따라 복사 방식이 다르다. 원시타입 : Number, String, Boolean, Undefined, Null 등 참조타입 : Object, Array 등 1. 깊은 복사 (Deep Copy) : 독립적인 메모리에 객체의 실제 값만을 복사하여 생성하는 것 : 원시타입의 변수를 복사할 때는 복사된 값을 독립적인 다른 메모리에 할당하기 때문에 원래 값과 복사된 값이 서로 영향을 미치지 않는다. : 깊은 복사된 객체는 객체 안에 객체가 있을 경우에도 원본과의 참조가 완전히 끊어진 객체를 말한다. const a = 1; let b = a; b = 2 console.log(a); //1 console.log(b); //2 console.log(a =..
[JavaScript] 데이터 형변환 자바스크립트의 데이터 형변환 방식은 크게 2가지로 분류할 수 있다. 1. 암시적 형변환 (Implicit type conversion) : 코드가 실행됨에 따라 자바스크립트 엔진이 필요성을 느끼고 자동으로 타입을 변환시키는 방법 1-1. 산술 연산자 더하기(+) 연산자는 숫자보다 문자열이 우선시 되어, 문자열과 다른 타입이 만나면 상대 타입이 문자로 변환되어 연산된다. 더하기 외 다른 연산자(-, *, /, %)는 문자열보다 숫자가 우선시 되어, 숫자와 다른 타입이 만나면 상대 타입이 숫자로 변환되어 연산된다. // + number + number // number => ex. 50+50 //100 number + string // string => ex. 100 + "점" //100점 string + ..

티스토리툴바