인프런 썸네일형 리스트형 [WEB2 - JavaScript] 객체 인프런 30강 "객체 쓰기와 읽기" - coworkers 라는 배열에 사전형식으로 데이터 넣어주기 ('key' : 'value') 형식 - value를 가져오기 위해 "배열명.키" 활용 - ex) coworkers.programmer - 초기에 선언하지 않고 추가도 가능 : 배열명.키 = "값" - ex) coworkers.bookkeeper = "duru"; - 띄어쓰기는 할 수 없기 떄문에 띄어쓰기가 존재하는 경우 다음과 같이 접근하여 추가 혹은 데이터 읽기 가능 - ex) coworkers["data scientist"] = "taeho"; : 추가할 때 - ex) coworkers["data scientist"] : 값 불러올 때 인프런 31강 "객체와 반복문" - 다음과 같이 반복문 사용하여 k.. 더보기 [WEB2 - JavaScript] 함수 인프런 25강 "함수의 기본" 함수 - function, method라고 부르기도 함 ** 어떤 것이 반복해서 출력되어야 할 때에, 반복문을 주로 사용하지만, 규칙이 없이 반복되는 경우도 존재 - 그럴 경우에는 함수를 만들어 사용 - line 12-13와 line 15-16이 동일한 것 확인해보면, 애매하게 다르기 때문에 반복문 사용은 어려움 - 반복되는 부분을 함수로 생성하려고 함 - script 태그 내부만 본다면, two라는 함수를 생성하여, 해당 부분에는 함수를 넣어주어 결과는 동일하지만, 코드는 간결하게 수정할 수 있음 인프런 26강 "매개변수와 인자" - Parameter & Argument 소제목 아래에 1+1 계산한 값 출력하도록 작성 - 동일하게 출력되도록 하되, 함수 내에 넣기 - 동일.. 더보기 [WEB2 - JavaScript] Lecture 23. 배열과 반복문의 활용 인프런 23강 "배열과 반복문의 활용" 이전 강의에서 학습한 배열과 반복문을 활용하여 night_day 실습에 활용하는 연습 - querySelector('a') 를 사용하면, a태그 하나만 가져오기 때문에 검색해보았을 때에, 검색하는 태그에 해당하는 것들을 모두 가져오고 싶을 때에는 document.querySelectorAll('a') 사용해야 함 - developer.mozilla.org/ko/docs/Web/API/Document/querySelectorAll 참고 - 결과는 정확하게 말하면 배열은 아니지만, 배열의 형태로 가져온다고 할 수 있음 - 예를 들어 결과를 list 이름의 배열에 저장한다고 하면, list.length를 통해 배열 원소의 개수 파악 가능 - line 10 : target.. 더보기 [WEB2 - JavaScript] Lecture 22. 배열과 반복문 inflearn JavaScript 22강 "배열과 반복문" - 코드에 여러 내용 추가해주면 다음과 같이 화면에 표현됨 - 같이 들어갈 내용이 여러 줄에 걸쳐 표현되었기 때문에 배열에 넣어주어 간단하게 표현 가능 ** 배열과 반복문 이용한 것 뿐 이전 화면과 차이는 없음을 확인할 수 있음 - 만약 coworkers 배열에 하나의 원소를 추가한다면, while문 조건 수정이 없다면 기존과 동일한 결과 확인 가능 - 하지만, coworkers 배열의 원소들은 변함 없지만, 조건이 원소의 개수보다 큰 수로 변경된다면, 나머지 값은 undefined로 출력됨 ** 더 좋은 방법은 직접 숫자를 지정해주는 것이 아니라, 배열 원소의 개수 구하는 함수 활용 (length) 이렇게 코드 실행 시킨다면 결과는 동일하게 .. 더보기 [WEB2 - JavaScript] CSS 기초 인프런 9강 "style 속성을 이용해서 CSS 사용하기" ** style 속성 안에는 CSS로 와야 함 - 글자 색상 변경 - JavaScript : 문자열 JavaScript의 글자색 변경됨 - 배경 색상 변경 - developer.mozilla.org/ko/docs/Web/CSS/background-color 참고 - JavaScript : 해당 문자열의 배경 색상 변경 인프런 10강 "style 태그를 이용해서 CSS 사용하기" - 내용 중 특정 부분을 진하게 하고 싶은 경우 (제목이 아닌 경우) - JavaScript : JavaScript만 볼드체로 강조해줌 - ... JavaScript ... - 처음 상태와 전혀 변화 없음 - ... JavaScript ... - 클래스명으로 선언해 준 경.. 더보기 [WEB2-JavaScript] HTML과 JS의 만남 인프런 3강 "HTML과 JS의 만남 (1) script 태그" HTML과 JS에 동일한 내용을 입력하였을 때 큰 차이가 없어 당황스러웠다 ,, ! 코드를 보면 웹페이지를 열어보면 동일하게 출력된 것을 확인 가능 !! HTML과 JavaScript의 차이점을 알아보자!!!!! HTML은 정적이라 한 번 작성해준 값이 변하지 않고 그대로 출력 but JS는 동적이기 때문에, 작성해준 값에 대해 수학적 연산도 가능함 예를 들어 html와 js에 동일하게 1+1을 입력한다면, ↓ 다음과 같이 JS는 수학 연산을 해준 결과값을 출력해주고, HTML은 입력해준 그대로 출력해주는 것 확인 ! 인프런 4강 "HTML과 JS의 만남 (2) 이벤트" 이벤트 : 웹 브라우저 위에서 일어나는 일들, 사건 (on 속성들) -.. 더보기 이전 1 다음