전체 글127 [ Visual Studio Code / 브라우저 ] JavaScript 디버깅 / 중단점 사용하기 현재 나는 JavaScript까지밖에 할줄 모르니,, 자바스크립트를 디버깅하는 방법에 대해 정리해보려고한다. 자바스크립트를 디버깅하려면 먼저 자바스크립트의 실행 환경에 대해 알아야한다.JavaScript 실행 환경 자바스크립트는 원래 웹 브라우저에서 동작하도록 설계된 언어이다.그러나, 시간이 지나 Node.js가 등장 하며 브라우저 밖에서도 실행할 수 있게 되었다.현재 자바스크립트는 브라우저 혹은 Node.js 위에서만 실행된며, 다른 환경(예: Python, Java 실행환경)에서는 동작하지 않는다. 1) 브라우저자바스크립트는 Google Chrome, Firefox, Safari 등 과 같은 웹 페이지에서 실행 가능하다. 브라우저는 JavaScript가 실행될 수 있도록 다음과 같은 기능을 제공하.. 2025. 1. 6. JSON(JavaScript Object Notation)이란? ( 메서드 : stringify / parse ) JSON 이란?만들어낸 객체를 네트워크를 통해 어딘가에 보내거나 로깅 목적으로 객체를 출력하고 싶다면,우리는 원하는 정보가 있는 객체 프로퍼티를 전부 문자열로 전환해야 한다. 만약, 우리가 만들어낸 객체가 복잡한 형태라면 어떨까? 개발 과정에서 프로퍼티가 계속 추가되거나 삭제, 수정된다면? 일일이 수정하는 방식은 꽤나 번거롭고 실수(오류)가 발생할 확률이 높을 것이다.JSON 은 이와 같은 문제를 해결하기 위해 나온 범용 포맷이다. JSON(JavaScript Object Notation)은 직역하자면 "자바스크립트 객체 표기법"으로 데이터를 쉽게 교환, 저장하기 위한 텍스트 기반의 표준이다. RFC 4627 표준에 정의되어 있는 JSON은 본래 자바스크립트에서 사용할 목적으로 만들어진 포맷이지만,데이.. 2025. 1. 3. [JavaScript] map() 과 filter() Array.prototype.map()map()은 Array.prototype에 정의된 함수이다. 따라서, 배열 객체에서만 사용할 수 있다. map() 메서드는 배열의 각 요소를 순회하며 콜백 함수를 적용한 결과를 모아 새로운 배열을 반환한다. 이때, map()은 새로운 배열로 복사하여 반환하기 때문에 원본 배열에 영향을 주지 않는다.map() 메서드의 기본형은 다음과 같다.//정의된 배열 arr에 map() 메서드를 적용let arr = [];arr.map(function(currentValue[, index[, array]]) { // 실행할 함수 로직;}[, thisArg]);형태별 구문 형식// 화살표 함수map((element) => { /* … */ })map((element[, ind.. 2025. 1. 2. [JavaScript] Date 값을 일관되게 출력하기 내장객체 Date() 값을 받아 yyyy-mm-dd 형태의 문자열로 변환시켜보려고 한다. UTC 기준먼저, 협정 세계시(UTC)를 기준으로 계산할 것인지, 로컬 시간대로 계산 할 것인지에 따라 차이가 존재한다.UTC는 서버다 데이터 베이스에서 사용하는 표준시간대로, 로컬 시간대와 상관없이 UTC기준의 날짜와 시간을 제공한다.toISOString() 메서드를 통해 가져오거나 다음과 같은 UTC 메서드를 통해 가져올 수 있다. toISOString() 메서드가 ISO 8601 표준형식( 예: 2024-12-27T04:19:13.272Z )으로 UTC 시간을 반환하도록 설계되어있기 때문에 UTC 시간 기준으로 형식을 변환하는 것이라면 간단하게 다음과 같이 코드를 작성할 수 있다.const date = new .. 2024. 12. 27. [JavaScript] 옵셔널 체이닝 " ?. " 옵셔널 체이닝(optional chaning)이란?옵셔널 체이닝은 ES2020(ECMAScript 2020)에서 정의된 표준 연산자이다.다른 연사자( +, - , *, /, .등)처럼 값을 평가하는 역할을 하는데, 옵셔널 체이닝은 객체나 속성에 접근할때 동작한다.옵셔널 체이닝을 사용하면 프로퍼티가 없는 중첩 객체를 에러 없이 안전하게 접근할 수 있다.옵셔널 체이닝 연산자(?.)는 체인의 각 참조가 유효한지 명시적으로 검증하지 않고,연결된 객체 체인 내에 깊숙히 위치한 속성 값을 읽을 수 있다.?. 연산자는 . 체이닝 연산자와 유사하게 작동하지만 만약 참조가 nullish(null 혹은 undefined)라면 에러가 발생하는 대신 표현식의 리턴값을 undefined로 리턴한다. 따라서 참조가 누락될 가능성.. 2024. 12. 26. [JavaScript] 정규 표현식, 정규식(Regular Expression) 정규 표현식(Regular Expression) 또는 정규식은 특정 문자 조합을 찾기 위한 패턴으로, 문자열에서 특정 패턴을 찾거나, 대체하거나, 분리하는데 사용된다.JavaScript에서 사용되는 정규식은 객체로서, 리터럴 표현으로 생성하거나 RegExp() 객체를 생성하여 사용할 수 있다.정규식 리터렬 표현은 /패턴/플래그 형식으로 구성되고, RegExp() 객체로 생성할 경우 new RegExp('패턴', '플래그')로 생성하여 사용된다.정규식 기본형 1. 정규식 리터럴 표현백슬러시( / )로 시작과 끝을 정의한다.백슬러시 사이에는 검색하고자 하는 패턴을 정의하고 뒤에 플래그를 붙여 동작 방식을 제어한다./패턴/플래그 2. 정규식 객체 생성RegExp 생성자를 사용하면 정규식 객체를 만들 수 있다... 2024. 12. 19. 이전 1 2 3 4 ··· 22 다음
