리서치이노션 지식위키리서치이노션 지식위키
  • Introduction
  • 코딩 스타일 가이드

    • 공통 스타일
    • 언어별 가이드
    • 코드 품질 및 규칙
    • 코드 리뷰 & 테스트
  • Front-End

    • HTML Layout
    • Javascript
    • Library
  • Back-End

    • Spring Boot
    • eGovFrame
  • 환경 구축

    • Window
    • Linux
    • Spring Framework
  • Figma 템플릿

    • 컴포넌트 시스템
    • 웹 서비스 스타일 가이드
    • 모바일 디자인 템플릿
  • HTML/CSS 템플릿

    • 기본 부트스트랩 템플릿
    • 관리자 테마 UI
  • 기타 자료

    • 디자인 시스템 문서
    • 공통 아이콘 폴더
  • 운영 사이트

    • GitLab (버전 관리)
    • Jenkins (배포 자동화)
    • SonarQube (정적 코드 분석)
    • Send API 문서 (Postman)
  • 접속 환경

    • VPN 연결
  • Introduction
  • 코딩 스타일 가이드

    • 공통 스타일
    • 언어별 가이드
    • 코드 품질 및 규칙
    • 코드 리뷰 & 테스트
  • Front-End

    • HTML Layout
    • Javascript
    • Library
  • Back-End

    • Spring Boot
    • eGovFrame
  • 환경 구축

    • Window
    • Linux
    • Spring Framework
  • Figma 템플릿

    • 컴포넌트 시스템
    • 웹 서비스 스타일 가이드
    • 모바일 디자인 템플릿
  • HTML/CSS 템플릿

    • 기본 부트스트랩 템플릿
    • 관리자 테마 UI
  • 기타 자료

    • 디자인 시스템 문서
    • 공통 아이콘 폴더
  • 운영 사이트

    • GitLab (버전 관리)
    • Jenkins (배포 자동화)
    • SonarQube (정적 코드 분석)
    • Send API 문서 (Postman)
  • 접속 환경

    • VPN 연결
  • 개발자 가이드

    • Front-End

      • HTML Layout

        • Introduction
      • JavaScript

        • Introduction
      • Library

        • Introduction

Introduction

이 섹션은 사내에서 사용하는 JavaScript의 기본 스타일 가이드와 실무 규칙을 정리합니다.
문법은 ES6+ 기준이며, 가독성 높은 코드와 재사용성을 우선합니다.


📌 이 섹션에서 다루는 내용

  • ES6+ 주요 문법 (let, const, arrow function, spread, destructuring 등)
  • DOM 이벤트 처리 방법
  • async/await 기반 비동기 처리 예제
  • 자주 사용하는 유틸 함수 모음
  • JavaScript → Vue 또는 다른 프레임워크에 연결하는 예시
  • 코드 스니펫, 실무 팁
  • 에러 핸들링과 디버깅 전략

💡 스타일 가이드 요약

  • var는 절대 사용하지 않습니다.
  • 모든 함수는 화살표 함수로 선언하세요.
  • 세미콜론은 항상 붙입니다.
  • == 대신 === 사용

🛠 실무에서 이렇게 씁니다

  • 새 기능을 구현할 때는 항상 모듈화된 함수 단위로 작성합니다.
  • 유틸 함수는 공통 유틸 폴더에 정리하고 재사용합니다.
  • 실시간 로그 확인은 console.table 또는 console.dir 권장

📎 참고 문서

  • MDN JavaScript
  • Airbnb JavaScript Style Guide
GitLab에서 이 페이지 편집하기
최종 수정일: 25. 4. 24. 오후 4:59
기여자: 개발 2팀/현준호 프로