자바스크립트 (6) 썸네일형 리스트형 JS 아코디언 구현하기 오류사항처음에 li에 두 번쨰 요소에 DOM을 가져와야 하는데 두 번째 요소를 가져오지를 못했다.해결currentTarget로 해결을 하였다. 이 녀석은 이벤트가 일어난 부모 요소를 선택을 해준다. 이벤트가 부착된 부모의 위치를 반환 ! nextElementSibling 이는 현재 요소의 바로 다음 형제 요소를 반환 같은 부모 요소를 가지고 있는 형제 요소 중에서 현재 요소보다 바로 뒤에 있는 요소를 선택하는 데 사용된다고 한다. currentTarget 로 이벤트가 일어난 부모를 요소를 가져오고, nextElementSibling로 다음 요소를 가져온다.구현화면 JS 설문조사 창 구현하기 설문조사 구현하다가 나온 문제처음에 이렇게 코드를 작성하니 각각의 버튼에 대해서 이벤트를 주었기 때문에 잘 동작을 하기는 했다.하지만 다중선택이 되었고 이는 문제에서 제시한 요구사항이 아니었다.문제에서 요구사항은 각각의 버튼을 클릭 할 수 있어야 했다.해결각각의 이벤트를 달아 주었으니깐 클릭시 클래스가 추가가 되니array 를 가져와 추가된 다른 버튼의 클래스를 삭제해 주었다. remove가 없으면 다 추가가 되니버튼 클릭 시 추가가 된 클래스들을 지워 주었다.완성 화면 원시와, 객체에 대한 메모리 메모리원시 값원시 값은 불변하다.변수 하나를 생성하고, 다른 변수에 할당을 한다면 같은 주소를 참조 하는 것이 아니라 새로운 주소를 생성하여 그 주소를 바라 보고 있다.원시 값은 이러한 특성 떄문에 불변하다는 거다.다른 변수에 할당되면 새로운 주소가 생성되고, 기존 주소는 영향을 받지 않는다.불변성 덕분에 원시 값을 변경하는 것은 불가능하고, 새로운 값으로 대체되는 방식다만 큰 데이터가 있다면 같은 주소를 참조하는 것이 아니기 떄문에 30바이트 라는 문자열이 있다면 생성하고 다른 변수에 할당한다면새로운 주소를 하나 더 생성하기 때문에 30 * 바이트 이다.``` let a = 1;let b = a;```# 참조형참조형 데이터는 가변성이다. 즉 변경이 가능하다.참조형 데이터는 객체를 하나 생성 후 다른 .. 왜 웹 개발은 Javascript로만 해야할까? JS의 탄생자바스크립트의 탄생95년, 약 90%의 시장 점유율로 웹 브라우저 시장을 지배하고 있던 넷스케이프 커뮤니케이션즈는 웹페이지의 보조적인 기능을 수행하기 위해 브라우저에서 동작하는 경량 프로그래밍 언어를 도입하기로 결장하였다. 그렇게 탄생한 것이 브렌던 아이크가 개발한 JS다.96년 3월에 넷스케이프 내비게이터2에 탑재되었고 모카로 명명되었다.그러다 9월 라이브스크립트로, 12월에는 오늘날의 우리가 아는 자바스크립트라는 이름으로 최종 명명되었다.현재 모든 브라우저의 표준 프로그래밍 언어로 자리 잡았다. 그러나 JS가 탄생하고 얼마 뒤 파생버전인 Jscript가 출시되어 위기를 맞는다자바스크립트의 표준화96년 8월, MS는 JS 파생 버전인 JScript를 인터넷 익스플로러 3.0에 탑재했다. 하지.. 자바스크립트에서의 메모리란? 원시 값과, 참조 값이 있다.원시 값이란let a = 1;let b = a;라고 변수를 선언하고 할당을 하면은 메모리에서는 두 개의 주소가 생성이 된다.같은 주소를 참조 할꺼 같지만 사실은 두 개의 주소가 만들어 진다.원시 값은 불변해야 하기 떄문에 이렇게 만들어진다.참조값객체를 생성하고 새로운 변수를 만들어 객체를 할당해 주면은 원시 값과 마찬가지로 새로운 주소를 참조 할꺼같지만참조 값은 주소를 바라보고 그 안에 프로퍼티 값을 참조 하고 있다.여기서 하나의 객체를 변경을 한다면 2개의 객체의 프로퍼티 값이 변경이 된다. 이를 가변성이라고 한다. // 참조 값 예시let obj1 = { name: "Alice" }; // 객체 생성let obj2 = obj1; // obj2는 obj1이 참조하는 동일한 .. html , js 정규식 계속 미루다가 공부하는 정규 표현식!정규표현식이란?정규 표현식, 또는 정규식은 문자열에서 특정 문자 조합을 찾기 위한 패턴js에서는 정규 표현식도 객체이다. RegExp, exec(), test() 메서드를 사용이 가능하다string의 match(), matchAll(), replace(), replaceAll(), search(), split() 메서드와 함께 사용이 가능하다.정규 표현식 만들기정규 표현식은 두가지 방법으로 만들 수 있다.리터럴 방식: 슬래시로 패턴을 감싸서 작성const re = /ab+c/;RegExp 객체의 생성자 호출const re = new RegExp("ab+c");정규 표현식 패턴 작성하기단순 패턴은 문자열을 있는 그대로 탐색할 떄 사용예를 들어 /abc/ 이 패턴은 문자열.. 이전 1 다음
