javascript30 [javascript] 자바스크립트 JSON Object 비교하기 (값비교, 두 JSON 비교) 안녕하세요. 오늘은 자바스크립트에서 JSON 구조로 된 Object 간 값 비교하는 여러 가지 방법을 정리해 보려고 합니다. 일반적인 Object값이라면 간단하게 === 비교를 하면 되지만 JSON처럼 key, value 구조를 가진 데이터는 바로 비교가 불가능합니다. 그럼 어떤 방식으로 비교하여 처리를 하는지 알아보도록 하겠습니다. 1. 동일한 JSON 데이터 비교 우선 aObject라는 json 구조의 데이터와 bObject라는 json 구조의 데이터의 값을 동일하게 준비하였습니다. 비교하는 방법은 총 5가지로 준비를 해봤습니다. 1. 일반 비교 const compare1 = aObject === bObject; 첫번째는 가장 단순한 === 비교입니다. 보통 일반적인 타입의 데이터를 비교할 때 많이 .. 2023. 1. 15. [javascript] 자바스크립트 "[object Object]" is not valid JSON (syntaxError 문법 에러 처리) 안녕하세요. 오늘은 자바스크립트에서 JSON.parse() 함수를 사용하다 보면 자주 마주하는 에러를 포스팅하려고 합니다. 에러 내용은 "[object Object]" is not valid JSON 입니다. 위의 에러 내용은 보통 JSON.parse() 함수를 사용하여 JSON 타입의 문자열 데이터를 다시 JSON 타입의 데이터로 parsing 하는데 이미 JSON 타입의 데이터인데 JSON.parse()를 사용하여 발생하게 되는 에러입니다. 에러 내용에서도 볼 수 있듯이 [object Object] 데이터는 JSON 타입의 데이터인데 강제로 JSON으로 만들어 달라고 해서 에러가 발생을 한 상태입니다. 위의 상황을 재현한 소스 코드를 작성하였습니다. 위의 소스 코드를 보게 되면 dataObj는 이미 .. 2023. 1. 14. [javascript] 자바스크립트 해당 월의 주차 수 구하기 안녕하세요. 오늘은 지난번 해당 연도의 주차 수 구하기 (https://sancode.tistory.com/38)에 이어서 해당 월의 주차 수 구하는 방법을 포스팅하려고 합니다. 연도 기준으로 구하는 방법과 비슷합니다. 그럼 바로 시작하겠습니다. 1. getMonthOfWeek() 해당 월 기준의 주차 수 구하기 먼저 월 기준의 주차를 구하는 getMonthOfWeek() 함수를 만들었습니다. 구할 날짜를 인자값으로 받고, 인자값의 날짜 기준으로 해당 월의 1일을 세팅합니다. * 변수 설명 - currDate : 주차 수를 구할 기준 날짜 - firstDate : 해당 월에서 1일로 맞춘 연도의 첫 번째 날짜 - diffDate : 기준 날짜에서 해당월 날짜 뺀 날짜 (기준 날짜가 해당 월의 몇 번째 일.. 2023. 1. 7. [javascript] 자바스크립트 해당연도의 주차수 구하기 안녕하세요. 오늘은 javascript의 주차 수 구하는 방법을 포스팅하려고 합니다. 자주 찾는 기능은 아니지만 한번씩 필요한 주차 수 구하는 함수입니다. 검색을 해보면 다양한 방법의 주차를 구하는 예제가 나와 있지만 저만의 색으로 만들어 봤습니다. 그럼 예제를 통해 설명하도록 하겠습니다. 1. getYearOfWeek() 해당 연도 기준의 주차 수 구하기 함수 명은 getYearOfWeek로 지었고, new Date() 기준으로 날짜를 받을 수 있도록 하였습니다. * 변수 설명 - currDate : 주차 수를 구할 기준 날짜 - firstDate : 해당 연도에서 1월 1일로 맞춘 연도의 첫 번째 날짜 - diffDate : 기준 날짜에서 해당연도 날짜 뺀 날짜 (기준 날짜가 해당 연도의 몇 번째 일.. 2023. 1. 6. jQuery .children() .parent() 배워보기! 오늘은 jQuery의 자식 요소를 찾아주는 children과 부모 요소를 찾아주는 prarent 함수에 대해서 정리해 보려고 한다. DOM 트리에서 요소를 탐색하고 조작하는 데 사용되는 메서드이며, 다양한 상황에 응용될 수 있는 함수다. children과 parent 함수의 개념 children과 parent 함수는 이름에서도 알 수 있듯이 자식과 부모 요소를 찾을 수 있도록 도와주는 기능의 함수다. 두 함수 모두 DOM 객체 내에서 요소 간의 관계를 탐색하고 조작할 때 편리하게 활용할 수 있으며, 특정 요소의 직계 자식 요소를 선택하여 스타일을 변경하거나, 특정 요소의 부모 요소를 선택하여 이벤트를 추가하는 등의 작업을 수행할 수 있다. children() children 함수는 선택한 요소의 직계 자.. 2023. 1. 2. [jQuery] .append() .prepend() 알아보자! 오늘은 jQuery의 append와 prepend 함수에 대한 내용을 정리해보려고 한다. 태그 요소를 추가할 때 주로 사용되는 개념이며, 활용도가 아주 높기 때문에 학습해 둔다면 유용하게 사용될 수 있다. 요소에 특정 콘텐츠를 추가해야 하는 경우는 많기 때문에 append와 prepend는 어떤 방식으로 동작하는지 개념과 활용 예제, 주의사항 등을 알아보자. append와 prepend의 개념 위에서 설명한 바와 같이 두 함수는 HTML 요소에 새로운 콘텐츠를 추가하는 데 주로 사용되는 함수다. 두 함수의 기능은 매우 유사하나 약간의 차이가 있기 때문에 차이점을 파악하고 상황에 맞게 활용하는 것이 중요하다. append append 함수는 선택한 요소의 마지막 자식 요소로 설정된 콘텐츠를 추가하는 기능이.. 2022. 12. 31. 이전 1 2 3 4 5 다음
