javascript

[JS] 구조 분해 할당

알고리즘 문제를 푸는데 구조 분해 할당을 잘 사용하면 코드를 많이 줄일 수 있었다. 구조 분해 할당에 대해 잘 정리해두고 문제에 활용하려 한다. 구조 분해 할당(destructuring assignment) 구조화된 배열과 같은 이터러블 또는 객체의 구조를 파괴하려 1개 이상의 변수에 개별적으로 할당하는 것을 말한다. 배열과 객체에서 필요한 값만 추출하여 변수에 할당할 때 유용하다. 1. 배열 구조 분해 할당 배열 구조 분해 할당의 대상(할당문의 우변)은 이터러블이어야 하며, 할당 기준은 배열의 인덱스이다. 즉 순서가 중요하다. 이때 변수의 개수와 이러터블의 요소 개수가 반드시 일치할 필요는 없다. const [x,y] =[1,2]; console.log(x,y)//1 2 const [x,y] =[1];..

<JS> 자바스트립트로 HTML수정

자바스크립트에서 태그, id, class 등을 생성하거나 수정할 수 있다. 이를 위해 DOM과 메서드, 프로퍼티의 범위에 대해 정확하게 이해해야 한다. 오늘 연습해 볼 부분은 사실 CSS에서 충분히 작성 가능함은 물론, CSS로 작성하는 편이 일반적으로 깔끔하나 DOM과 이벤트리스너를 연습해본다는 개념으로 접해본다. 1. HTML 온전히 자바스크립트로 문서를 수정할 것이기 때문에, 추후 자바스크립트 연결을 위한 태그 외에는 비워둔다. 2. Javascript let h2 = document.createElement("h2"); // 1. HTML에 없는 태그를 생성 h2.innerHTML = "Hello!"; // 2. 생성한 태그에 넣을 내용 기입 h2.style.color = "white"; docu..

[JS] 객체

객체에 대한 이해 1. 왜 객체를 쓰는지 const userName = "poylib"; const userAge = "26"; const userCheck = true; const userAddress = "changwon"; // 'user'가 반복되는게 보기 불-편하다 const user = ["poylib", 26, true, "changwon"]; // array로 정렬하면 간단해지지만 userName이 "poylib"인지 "changwon"인지 알기어렵다 // 객체로 해결 ! const userObj = { name : "poylib", age : 26, check : true, address : "changwon" } // 읽기쉬워지고, 원하는 값을 불러오기 편하다 // ex) console..