WEB2 - JavaScript

파일로 쪼개서 정리 정돈하기

변경사항

 

댓글

댓글 본문
작성자
비밀번호
  1. 창의력
    창의력 완료 감솨
  2. OneJae EE
    20.03.29 일 / 37세 비전공자 / 완료
  3. 혹등고래
    완료!
  4. 0cddo
    완료!
  5. Yohanesty
    완료
  6. 뿡뿡팡야
    완료
  7. jade
    파일로 쪼개기 : 유지보수 용이
    <script src = "파일명.js"> </script>
  8. Useok
    완료
  9. 비비빅
    다음 강의로 Ajax 들으시면 됩니다
    대화보기
    • 완료
    • 저도
      저도궁금합니다 ㅜㅜ
      대화보기
      • 완료
      • daniellee123456
        완료
      • 완료
      • 넘무
        안돼길래 한참 방황했는데, 댓글보고 알았네요.. 파일 입력후엔 저장 꼭!
      • 규몽
        완료
      • 숩숩이
        완료
      • eddylee123456
        완료
      • 봄숙
        파일로써 한번 더 정리박스 만들기!
        js파일을 만들어서 링크로 넣기
        js파일엔 <script> 태그 넣지 않기
      • 감사합니다.완료
      • 항상 감사합니다.!!
      • 메메
        ~.js 파일을 만든 뒤 <head>에 추가
        <script src="~.js"></script>
      • 춤춤
        완료!
      • thsths
        완료
      • 스티븐잡숴
        완료
      • Jeremy Jo
        완료
      • 지나감
        처음부터 생각하고 짜지 않습니다. 물론 숙련된 사람이라면 이런 기능들은 보나마나 객체화 파일화가 필요하니까 미리 해둬야지 할 수 있겠지만, 숙련되지 않은 사람이라면 그냥 손가는대로 짠 뒤 자신이 짠 코드를 훑어보며 다시 객체화와 파일화 과정을 거치면 됩니다. 이런 과정을 리팩토링(Refactoring)이라고 하며, 컴퓨터 공학에서 매우 중요한 과정입니다.
        대화보기
        • 문병민
          완료
        • 샬롬
          완료
        • :p
          colors.js

          css정리할때처럼 js파일로 정리하기!
        • 딥허브
          2019.12.21
          진짜 신기하고 멋지긴한데 이걸 처음부터 파일화 객체화를
          생각하고 짠다고 하면.. 머리가...
        • 울면안돼
          colors.js 파일에 스크립트태그 제외하고 버튼에 관한 코드를 붙여넣기 했는데요 colors.js 파일에서 오류가 엄청많이 나서 기존파일에서 스크립트태그에 src로 color.js를 줘도 동작을 안하네요 colors.js 파일에 오류가 엄청 나서 그런거 같은데 오류가 왜 나는건가요? 정상적으로 작동하는 코드였는데 colors.js 파일에 넣으니까 오류가 50여 가지가 나는데.. 뭔지도 모르겠고.. 어떡하죠???
          var Body = {
          setbackgroundcolor:function(color){
          document.querySelector('body').style.backgroundColor=color;
          },
          setcolor:function(color){
          document.querySelector('body').style.color=color;
          }

          }
          var Links = {
          setcolor:function(color){
          var alist = document.querySelectorAll('a');
          var i = 0 ;
          while(i < alist.length){
          alist[i].style.color = color;
          i = i + 1;
          }
          }
          }
          function nightdayHandler(self){
          var target = document.querySelector('body');
          if(self.value === 'night'){
          Body.setbackgroundcolor('black');
          Body.setcolor('white');
          self.value = 'day';

          Links.setcolor('yellow');
          }

          else{
          Body.setbackgroundcolor('white');
          Body.setcolor('black');
          self.value = 'night';

          Links.setcolor('blue');
          }
          }
          이 코드입니다 ㅠ

          참고로 brackets 쓰고 있습니다 ㅠ
        • codinginpain
          크.. 완료
        • 이명박
          다른 페이지로 넘어가도 day night모드가 초기화 되지 않게 하는방법이 있나요?
        • 아빠늑대
          객체보다 더 큰 정리정돈의 도구를 배운다.
          파일쪼개기
          이것을 사용하면 아무리 웹 페이지가많아도 감당할 수 있게 된다.
          <input>을 옮기면 작동하지 않는다! <script>가 따라가지 않았으니까
          복붙복붙 반복반복
          1억개라면?(feat. 극단)
          powderblue를 수정하려면? 절망
          자 colors.js를 만듭니다. <script>내부를 옮겨주고, 원래 있던 script에 src="colors.js" 요소를 붙여줍니다.
          폭발적 효과!
          colors.js만 include(참조)한다면 가독성이 좋아지고, 코드가 훨씬 명확해지고, 유지보수도 쉬워진다.
          자 장점 한가지 더
          inspect(검사) network tab을 보면 브라우저가 colors.js를 cache합니다.
          돈이 아니라 저장해 둔 것. 이제 사용자와 서버 모두 네트워크 트레픽이 줄고, 속도도 향상. 비용 절감
          정리정돈의 끝판왕, 파일 쪼개기입니다.
        • 홍주호
          20191116 완료
        • 우유병
          다솜화이팅
        • 땀쟁이
          엄청 늦은 답변이긴한데요..ㅎ 파일로 만들어둔 colors.js를 저장하신다음에 리로드 하시면 될꺼에요!
          저는 8개월뒤인 지금 듣는중인데 저장하고나니까 동작되네요
          대화보기
          • 육포
            20191103
          • 씬이삼
            아래 사이트 확인해보세요~
            https://flaviocopes.com......de/
            대화보기
            • 굽벵이
              완료
            • 박창신
              완료
            • 코딩만이 살길이다
              완료
            • 거룩한깜상
              저도 궁금한데 어떻게 해야ㅐ되는지 아시는분 계신가요..?
              다른 웹페이지의 value값도 바뀌게 해야되는건지..
              만약 그런거면 그건 어떻게 해야될까요 ㅠㅠ
              대화보기
              • 쑤우
                수강완료. 감사합니다.
              • 현우
                완료
              • 정완료
                완료
              • 한조
                감사합니다!
              • 들국화
                감사합니다
              • JT_brand
                완료
              버전 관리
              egoing
              현재 버전
              선택 버전
              graphittie 자세히 보기