JAVASCRIPT 얕은복사와 깊은복사 🔎 기본 데이터 타입 javascript의 데이터형은 기본 데이터 타입과 참조형 데이터 타입으로 구분된다. 기본 데이터 타입은 아래와 같이 데이터를 복사하게 된다. const a = 1 const b = a b = 2 console.log(a) // 1 console.log(b) // 2 const c = 1 const d = c c = 2 console.log(c) // 2 console.log(d) // 1 🔎 얕은 복사 참조형 데이터 타입 (Array, Object)의 경우 기본형과 동일하게 데이터를 복사하게 되면 얕은 복사(참조 주소 공유)가 되어 다음과 같이 동작한다. const arr1 = ['a', 'b', 'c', 'd'] const arr2 = ar..
배열관련 메소드 (Array Method) javascript에서 배열을 사용할 때 자주 사용하는 methods pop : 배열의 뒷 요소를 제거하고 그 요소를 반환 const arr = ['a', 'b', 'c']; const pop_test = arr.pop(); console.log(pop_test); // c console.log(arr); // ['a', 'b'] push : 하나 이상의 요소를 배열의 가장 마지막에 추가 const arr = ['a', 'b', 'c']; arr.push('d'); // ['a', 'b', 'c', 'd'] arr.push('e', 'f'); // ['a', 'b', 'c', 'd', 'e', 'f'] shift : 배열의 첫 요소를 제거하고 그 요소를 반환 c..
앞서 다루었던 Promise 문법이 콜백 헬을 해결하였지만, 여전히 코드가 장황합니다. Node 7.6버전(javascript ES2017)부터 지원되는async/await 문법은 Promise 코드를 한번 더 깔끔하게 줄여줍니다. ■ async/await문법 사용법 - 기존 Promise문법 - async/await 변환 함수 선언부를 일반 함수 대신 async function으로 교체한 후, 프로미스 앞에 await을 붙여주었습니다. 해당 함수는 await이 붙은 프로미스가 resolve될 때까지 대기한 후 다음 로직으로 넘어가게 됩니다. - async/await 화살표 함수 변환 앞서 배운 Promise문법과 async/await문법을 사용하여 중첩되는 콜백 함수를 간략하게 변환하였습니다. 많은 N..
javascript에서는 주로 비동기 프로그래밍을 사용하기 때문에 콜백 함수를 자주 사용합니다. 콜백함수가 중첩되어 사용되다 보면 코딩의 깊이가 깊어지고 각 콜백 함수 별 에러를 따로 처리해주어야하는 콜백 헬이 발생합니다. 하지만 ES2015부터 지원하는 Promise는 이러한 콜백 헬을 극복했다는 평가를 받고 있습니다. ■ Promise 사용법 - Promise 객체 생성 new Promise로 프로미스를 생성하며 이렇게 생성된 promise변수에 then과 catch 매서드를 사용할 수 있습니다. 프로미스 내부에서 resolve가 호출되면 then이 reject가 호출되면 catch가 실행되며 resolve와 reject에 넣어준 인자를 then과 catch의 매개변수에서 받을 수 있습니다. 위 코드..
동적인 웹페이지를 위해 HTML 태그의 속성값을 가져오거나 변경해야하는 경우가 많다 이럴 때 사용하기 좋은 Jquery 매서드가 attr() 매서드이다. ■ 속성값 가져오기 - attr(attributeName) 안녕하세요 test 클래스를 포함한 태그의 msg값을 alert하기 때문에 hi라는 alert가 발생한다. ■ 속성값 변경하기 - attr(attributeName, '변경값') 변경 test_img라는 id값을 가진 태그의 src속성값을 변경하여 img가 변경된다.
