개발일지/자바스크립트15 JS 프로토타입이란 자바스크립트는 프로토타입(prototype) 기반의 독특한 프로그래밍 언어입니다. 클래스 기반의 객체 지향 프로그래밍도 가능하게 하는 이 프로토타입은 자바스크립트에서 객체 간의 상속을 이해하는 핵심 개념이죠. 이번 글에서는 자바스크립트에서 객체의 프로토타입을 어떻게 다뤄야 하는지, 프로토타입의 설정과 변경은 어떻게 이루어지는지 등을 살펴보겠습니다.“proto” 속성: 프로토타입의 비밀 통로자바스크립트에서 모든 객체는 자신의 프로토타입을 “proto”라는 비밀 속성에 저장하고 있습니다. 이 속성은 객체가 어디서 상속받았는지, 상속 체인의 상위에 무엇이 있는지를 알 수 있게 해주는 중요한 속성입니다.하지만, 이 “proto”는 현재 폐기된(deprecated) 속성입니다. 따라서 애플리케이션 코드에서 직접적.. 개발일지/자바스크립트 2024. 11. 13. JS 객체에 특정 속성이 있는지 확인하는 법 1. in 연산자 사용하기자바스크립트에서 객체에 어떤 속성이 있는지 확인하는 가장 널리 알려진 방법은 in 연산자를 사용하는 것입니다. 이 연산자는 다음과 같은 형태로 사용합니다:const obj = { a: 1 };"a" in obj; // true // 객체에 'a'라는 속성이 존재하므로 true 반환"b" in obj; // false // 객체에 'b'라는 속성이 없으므로 false 반환in 연산자는 객체에 해당 속성이 존재하면 true를, 존재하지 않으면 false를 반환합니다. 객체를 생성한 후에도 얼마든지 속성을 추가할 수 있기 때문에 in 연산자의 결과는 객체의 현재 상태에 따라 달라질 수 있습니다.obj.b = 2;"b" in obj; // true // 'b' 속성을 추가했기 때문에.. 개발일지/자바스크립트 2024. 11. 13. 자바스크립트에서 데이터 그룹화하기: groupBy() 활용법 자바스크립트를 이용하여 데이터를 처리하는 과정에서도 데이터를 특정 기준에 따라 그룹화하는 작업이 자주 필요합니다. 이번 포스팅에서는 자바스크립트에서 데이터를 효과적으로 그룹화하는 방법을 소개하겠습니다. 특히 최신 자바스크립트에서 사용할 수 있는 Object.groupBy()와 Map.groupBy()를 활용하여 간단하고 가독성 높은 코드를 작성하는 방법에 대해 알아보겠습니다.기존 데이터 그룹화 방법우선 데이터를 그룹화하는 작업을 하기 위해 reduce() 함수나 반복문을 이용한 기존 방법은 코드가 길고 유지보수가 어렵다는 단점이 있었습니다. 예를 들어, 여러 사용자의 이름, 나이, 국가 정보를 가진 배열이 있을 때, 국가별로 사용자를 분류하고 싶다고 가정해봅시다.const users = [ { name.. 개발일지/자바스크립트 2024. 11. 1. 코드 실행 특정 시간 대기/지연 방법 JavaScript에서 코드의 실행을 특정 시간 동안 지연시키고 싶을 때가 종종 있습니다. 이럴 때 유용하게 사용할 수 있는 것이 바로 Promise와 setTimeout을 조합한 방법입니다. 간단하게 한 줄짜리 함수로 정의해두고 호출하는 방식으로 손쉽게 구현할 수 있습니다.다음은 실행 지연을 위한 간단한 함수입니다. const delayTime = async (millisec) => new Promise((resolve) => setTimeout(resolve, millisec)); 이 함수를 사용하면 코드의 실행을 원하는 시간만큼 지연시킬 수 있습니다. 예를 들어 delayTime() 함수를 호출하면 Promise 객체가 반환되므로, then()을 이용한 콜백 함수 방식이나 async/await 방식.. 개발일지/자바스크립트 2024. 10. 31. jstl 비교 연산자 == (같음): 왼쪽 피연산자와 오른쪽 피연산자가 같은지 비교합니다. 예시: ${age == 18} (age가 18인 경우 참) != (같지 않음): 왼쪽 피연산자와 오른쪽 피연산자가 다른지 비교합니다. 예시: ${gender != 'Male'} (gender가 'Male'이 아닌 경우 참) 10000} (price가 10000보다 큰 경우 참) = 10} (quantity가 10보다 크거나 같은 경우 참) 위의 비교 연산자를 사용하여 JSTL에서 변수나 값들을 비교할 수 있습니다. 조건문이나 반복문 등에서 사용하여 원하는 동작을 구현하실 수 있습니다. lt (작음): 연산자와 동일하게 왼쪽 피연산자가 오른쪽 피연산자보다 큰지 비교합니다. 예시: ${price gt 10000} (price가 10000보.. 개발일지/자바스크립트 2024. 1. 19. jstl 조건문 (if, choose) 와 는 조건문을 처리하는 JSP 태그입니다. 각각의 장단점과 코드 적용 방법을 정리해보겠습니다. : 장점: 여러 개의 조건을 처리할 수 있습니다. 태그를 여러 번 사용하여 다양한 조건을 처리할 수 있습니다. 가독성이 좋습니다. 여러 개의 조건을 명확하게 구분하여 작성할 수 있어 코드의 가독성이 높아집니다. 단점: 코드의 길이가 길어질 수 있습니다. 여러 개의 태그를 작성해야 하므로 코드가 길어질 수 있습니다. : 장점: 단일 조건을 처리할 때 간편합니다. 단일 조건을 처리할 때에는 태그를 사용하는 것이 간단하고 편리합니다. 코드의 길이가 짧습니다. 단일 조건을 처리할 때에는 태그를 사용하므로 코드의 길이가 짧아집니다. 단점: 여러 개의 조건을 처리하기에는 제한적입니다. 태그는 단일 조건만을 처리하기 때문.. 개발일지/자바스크립트 2024. 1. 19. <%= %> , <% %> 차이 와 는 두 가지 다른 종류의 JavaScript 코드를 나타내는 데 사용되는 템플릿 태그입니다. 이들은 주로 서버 사이드 템플릿 엔진에서 사용됩니다. : 이 템플릿 태그는 값을 출력하는 데 사용됩니다. 예를 들어, 서버 사이드 템플릿에서 이 태그 내의 JavaScript 코드는 특정 변수의 값을 출력할 때 사용됩니다. 예시: Hello, ! : 이 템플릿 태그는 단순히 JavaScript 코드 블록을 나타냅니다. 이 코드 블록 내에서는 어떠한 값도 출력되지 않고, 주로 제어 구조, 반복문, 함수 등을 사용할 때 활용됩니다. 예시: 개발일지/자바스크립트 2024. 1. 5. getElementById 사용하기 개발일지/자바스크립트 2022. 11. 18. Prompt 1 2 개발일지/자바스크립트 2022. 11. 16. confirm사용하기 1번 코드에서 confirm사용하여 문자열을 표시해준다. 그럼 밑에 있는 그림같이 화면에 출력이 된다. 여기서 확인은 true를 반환하고, 취소는 false를 반환한다. 그럼 반환되는 값에 따라 값을 찍어주는데 값을 홈페이지창에 띄워줄거다 그럼 document.write("출력할 문자열") 를 사용하여 출력하고 싶은 문자열을 써주면 된다. console.log를 찍게되면 ans의 반환값을 출력해준다. 확인 눌렀을때 취소 눌렀을때 개발일지/자바스크립트 2022. 11. 16. 난수출력 , onload 사용하기 난수 출력, onload사용하기 onload : 홈페이지가 로드 됬을경우!!! 개발일지/자바스크립트 2022. 11. 16. 전역변수의 사용법 결과 자바 스크립트 입니다. 개발일지/자바스크립트 2022. 11. 16. 이전 1 2 다음
