애딧

🤔 겉보기에는 길이 4인데, 실제로는 2?다음과 같은 배열을 봤을 때, 얼핏 보면 배열 길이가 4처럼 보인다.[ 'one', 'two', once: 'once', twice: 'twice' ] 하지만 실제로는 길이가 2인 배열이다. 왜 그럴까?이유는 바로 자바스크립트 배열은 객체이기 때문이다.🧠 핵심 개념: 배열은 객체다자바스크립트의 배열은 Array라는 특별한 형태의 객체(Object)다.객체이기 때문에 배열에 숫자 인덱스를 갖는 요소 외에도, 직접 속성(property)을 추가할 수 있다.const arr = ['one', 'two'];arr.once = 'once';arr.twice = 'twice';console.log(arr.length); // 2이처럼 arr.once나 arr.twice는..

🔎 왜 이걸 다루는 걸까?코딩 테스트나 실무에서 두 값의 위치를 바꾸는 작업, 흔히 말하는 swap은 정말 자주 등장한다.특히 정렬 알고리즘이나 배열 인덱스를 조작하는 문제에서 필수로 등장하니, 깔끔하게 익혀두면 좋다!🧠 핵심 개념 / 코드 예제✅ 임시 변수 사용가장 기본적인 방식은 임시 변수(temp)를 만들어서 교환하는 방법이다.let a = 1;let b = 2;let temp = a;a = b;b = temp;console.log(a, b); // 2 1✨ 구조 분해 할당 (비구조화 할당)자바스크립트에서는 배열 디스트럭처링 문법으로 간단하게 swap 할 수 있다.let a = 1;let b = 2;[a, b] = [b, a];console.log(a, b); // 2 1코드 한 줄로 값을 바꿀..

✨ 자바스크립트 배열 정렬 – 문자열 길이 기준으로 정렬하기🔎 왜 이걸 다루는 걸까?프로그래밍을 하다 보면 문자열 배열을 길이 순서대로 정렬해야 할 일이 자주 생긴다.예를 들어, 짧은 단어부터 차례로 탐색하거나, DP 문제에서 작은 케이스부터 처리할 때 유용하게 쓰일 수 있다.자바스크립트에서는 아주 간단한 코드 한 줄로 이걸 구현할 수 있다!🧠 핵심 개념 / 코드 예제📌 기본 문법words.sort((a, b) => a.length - b.length)이 코드 한 줄이 바로 문자열 배열을 길이 기준 오름차순으로 정렬해준다.🧪 예시const words = ["banana", "a", "apple", "bat"];words.sort((a, b) => a.length - b.length);console..

(function () { statements })(); https://developer.mozilla.org/ko/docs/Glossary/IIFE

append()와 appendChild() 는 부모 노드에 자식 노드를 추가하는 메서드로 같은 기능을 하지만 몇 가지 차이점이 있습니다. 1. append() 노드 객체(Node object)나 DOMString(text)를 사용할 수 있습니다. 또한 한번에 여러 개의 자식 요소를 설정할 수 있습니다. Node object 사용 예시 const parent = document.createElement('div'); const child = document.createElement('p'); parent.append(child) // 결과 // 문자열(DOMString) 사용 예시 const parent = document.createElement('div'); parent.append('child') /..

1. Javascript document.createElement() 메서드를 사용하여 태그와 그 안에 들어갈 태그를 만들고 DOM 내부에 존재하는 태그에 만든 양식을 추가하여 이벤트 실행 /* Javascript */ // 동적 form 생성 let form = document.createElement('form'); // form 세팅 form.method = 'post'; form.action = 'url'; form.name = 'newForm'; form.target = '_blank'; form.encType = 'application/x-www-form-urlencoded'; // encoding - 요소의 method 속성값이 “post”인 경우에만 사용할 수 있음 // key, value..

1. POST 방식의 필요성 [HTTP 메소드] GET 방식의 URL 파라미터 노출 GET 방식은 클라이언트에서 서버로 데이터를 전달할 때 주소 뒤에 이름과 값이 결합된 쿼리 스트링으로 전달하는 전송 방식이다. POST 방식보다 상대적으로 전송 속도가 빠르지만 주소창에 쿼리 스트링이 그대로 보이기 때문에 보안성이 떨어진다. 이런 보안를 해결하기 위해 POST 방식을 사용한다. POST 방식은 URL에 파라미터를 노출하지 않기위해 body에 데이터를 넣어 보낸다. 2. Javascript에서 POST 방식으로 보내는 방법 function sendPost(url){ let form = document.createElement('form'); // 동적 form 생성 form.method = 'post'; /..