소스코드
댓글
-
완료 -
완료스
-
완료~
-
완료 -
2019.03.04
복습2 완료 -
완료!
-
완료! -
2019-02-18 완료
-
완료
-
고맙습니다
-
감사합니다. 완료
-
완료! -
완료 감사합ㄴㅏ덩!
-
this랑 target으로 중복된 내용 싹 지우고 대체할때 쾌감이 느껴지네요... 짜릿...
-
감사합니다
-
완료 감사합니다:)
-
완료
-
완료
-
완료
-
2019.01.11
this 는 자기 자신을 표현하고
중복되는 코드를 제거하기 위해 긴 코드를 변수하나로 정의하여 변수이름을 대신사용하는 것. -
https://developer.mozilla.org......yId
The Document method getElementById() returns an Element object representing the element whose id property matches the specified string. Since element IDs are required to be unique if specified, they're a useful way to get access to a specific element quickly.
If you need to get access to an element which doesn't have an ID, you can use querySelector() to find the element using any selector.
getElementById는 id에 해당하는 element를 반환하고, querySelector는 id가 없는 element를 반환합니다.
그러므로 '<body>'를 '<body id="body">'로 수정하면, getElementById와 querySelector 모두 동작합니다. -
if(this.value==='button1'){
document.querySelector('body').style.backgroundColor='black';
this.value='red'}
else{document.querySelector('body').style.backgroundColor='red';
this.value='button1';
}
여기서 querySelector를 쓰면 되는데 왜 getElementById 로 쓰면 안되는 건가요?? -
리팩토링 잘 배우고 갑니다. -
이런거 할때마다 소름돋는다
-
this 로 훈훈한 마무리
공중제비 3회전 돌고 갑니다 -
감사합니다. -
잘 들었습니다! 매번 감사합니다 ^^
-
감사합니다.
-
잘들었습니다 -
target은
var target = document.querySelector('body');
변수에요~ -
target, this 강좌 뭐 보면 되나요 ㅠㅠ?
-
웅 카렌 에델 들음
-
중복의 제거는 정말 정말 정말로 중요합니다!!!! 프로젝트 할 때 중복만 제거해도 몇백줄은 그냥 없어진다는. 그리고 유지보수도 훨씬 쉬워지구요. -
감사합니다!!
-
감사합니다 -
함수로 중복제거를 빨리 하고싶네요... 혼자 해보려니까 안되네요 ㅎㅎ;
-
중복의 제거를 위해 힘써주었을 많을 분들을 생각해 봅니다. 덕분에 이렇게 심플하게 배우네요~
-
조건문 활용을 잘해야 겠습니다.^^
-
<input name="night_day" type="button" value="night" onclick="
var target = document.querySelector('body');
var array_fruits = document.getElementsByName('night_day');
if(this.value === 'night'){
target.style.backgroundColor = 'black';
target.style.color = 'white';
for (var i = 0; i < array_fruits.length; i++) {
array_fruits[i].value='day';
}
} else {
target.style.backgroundColor = 'white';
target.style.color = 'black';
for (var i = 0; i < array_fruits.length; i++) {
array_fruits[i].value='night';
}
}
">
name 태그는 중복되니까 이걸로하시면 아래쪽도 전부 다바뀝니다. -
코드는 일단 읽기쉽고 단순하게 만드는게 좋다
-
조언 한가지 부탁드립니다.
위쪽의 토글버튼과 페이지 아래쪽의 토글 버튼이 같은 값으로 동시에 작동되게 하고싶습니다. 위에서 night를 누르면 아래쪽의 버튼도 day로 바뀌게끔요. 배운 것 내에서 궁리를 해보았으나, 각각의 input 에 id를 부여하게 되면, 떨어져있는 두 태그에 한가지의 id를 부여할 수 없으므로 id 2개를 사용해야 할 것 같습니다. 그런데 그렇게 되면 1억개의 버튼이 있을 때를 상정하면 매우 안좋은 방법일 것 같습니다. class는 자바스크립트와 함꼐 사용이 불가하다고 하는데.. 다른 좋은 방법이 있을까요? -
감사히 잘 봤습니다. 감사합니다~ ^^
-
target에 .style까지 포함시키면 (target = document.querySelector('body').style), .style 중복까지도 없앨 수 있네요^^
-
this와 변수 사용을 통한 코드의 중복 제거 효과
-
이고잉님이 같은 문자열을 한방에 선택하셨는데, Brackets를 사용하시는 분은 찾고자하는 문자열 선택후 Ctrl+B누르면 같은 문자열 찾아집니다.
-
Ctrl+D 누르시면 하위부분에서 같은 단어를 선택할 수 있습니다. 하위부분에서 끝나면 맨위로 올라가서 선택합니다.
맥os쓰시면 cmd+D 입니다. -
강의 잘 들었습니다^^
리팩토링은 아래와 같은 사항을 개선하는 작업:
- 코드의 효율성
- 가독성
- 유지보수의 편리성
- 중복된 코드 (제거)
수업문제:
- 자기자신을 가르키는 자바스크립트 코드는 this 로 대체할 수 있다.
- 중복된 코드는 변수(variable)을 만들어 대체할 수 있다. -
혹시 선생님처럼 똑같은 글자 선택게속 할려면. 단축키 뭐써야되는지 혹시 아시는분 알려주시면 감사하겠습니다.
-
이하빛
아마 선생님은 <> 안에 document.querySelector('body') 가 있는 태그면
그게 몇억줄의 <>로 싸여있는 코드더라도
var target = document.querySelector('body') 해놓고
한꺼번에 바꿀 수 있다고 말씀하시는 것 같아요 -
target으로 바꾸는 내용에서 바꿔야할 태그가 1억개일 때
var target = document.querySelector('body')
이 (바디)부분만 바꾸면 된다고 하셨는데,
<input type="button" value="night" onclick="
var target = document.querySelector('body')
if(this.value === 'night'){
target.style.background='black';
target.style.color='white';
this.value='day'
} else {
target.style.background='white';
target.style.color='black';
this.value='night'
}
">
이 코드가 반복
<input type="button" value="night" onclick="
var target = document.querySelector('body')
if(this.value === 'night'){
target.style.background='black';
target.style.color='white';
this.value='day'
} else {
target.style.background='white';
target.style.color='black';
this.value='night'
}
">
등
등
이렇게 나열되어있을 때 맨 위에 써진 코드
var target = document.querySelector('body') 한 줄만 바꾸면
< " " > 안에 있는 모든 버튼 코드에 적용된다는 말인가요?
< > 이거 안에 들어있는 한에서만 적용되는거 아닌가요?
1억개가 적용된다면
다음 태그에서는
<input type="button" value="night" onclick="
타겟 부분이 빠진 상태로 코드를 넣을 수 있는건가요?
if(this.value === 'night'){
target.style.background='black';
target.style.color='white';
this.value='day'
} else {
target.style.background='white';
target.style.color='black';
this.value='night'
}
">
아니면-------------------------------------------------------------
< > 이거 안에 중복되는 코드가 어떻게 1억개가 들어있을 수 있는건지..
질문 이해가 되셨을지 모르겠어요ㅠㅠ
버전 관리
| egoing |
| 현재 버전 | |
|---|---|
| 선택 버전 |
