프런트엔드 유닛코딩 사양은 어떻게 되나요?-JS 튜토리얼-php.cn

이번에는 프론트엔드 모노머 코딩 사양은 무엇인지, 프론트엔드 모노리식 코딩 사양 사용 시 주의사항은 무엇인지 알려드리겠습니다. 다음은 실제 사례를 살펴보겠습니다.

프론트엔드 코드든 백엔드 코드든 코딩 표준은 특히 중요합니다. 특히 대규모 프로젝트에서는 코드, 형식 및 요구 사항을 처음에 표준화하면 작업량이 많이 줄어들고 이후 단계에 도움이 됩니다. 코드를 유지합니다.

3. 태그는 생략할 수 없습니다. 1 태그 사용은 태그 중첩 규칙을 준수해야 합니다. 예를 들어 p는 p에 배치할 수 없고 tbody는 배치해야 합니다. 테이블에. h1,h2,h3,h4,h5,h6 - 계층적 제목 HTML - 표준화 작성 1. 파비콘에 액세스할 수 있는지 확인하십시오. (favicon.ico 파일을 루트 디렉토리에 두고 링크를 사용하여 파비콘을 지정하십시오.) 18 CSS 작성 표준 스타일 줄 길이 한 줄이 분할되지 않는 한 각 줄은 120자를 초과할 수 없습니다. 19 CSS 작성 표준화 이름: 예제 글꼴 계열: Arial, sans-serif; 글꼴 크기: 2. Windows 플랫폼에 표시해야 하는 중국어 콘텐츠는 일반 글꼴 스타일을 사용하지 마세요. ㅋㅋㅋ an_apple, 밑줄로 이름 지정 - is -an-apple namespace4. 비공개(보호된) 멤버(속성, 함수 등): _로 시작해야 합니다. 5. 부울 유형은 해당 유형을 나타내기 위해 is, has 등으로 시작해야 합니다.6. 이름을 지정할 때 의미에도 주의해야 합니다. 예를 들어 변수 이름은 명사를 사용해야 하고, 함수 이름은 동사 목적어 구문(getAccListData)을 사용해야 합니다. ・사용하지 않는 서브루틴이 있음・사용하지 않는 변수 정의 ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ

프런트엔드 싱글코딩 사양 구성표
No	Category	검증 내용
1	페이지 디자인	목록 제목이 중앙에 표시됩니다.
2	페이지 디자인	쿼리 데이터 영역 데이터 표시 스타일: 1 무한 길이 중국어, 무한 길이 영어, 무한 길이 영어 숫자는 왼쪽에 있습니다. 2. 중앙에는 고정 길이, 고정 값 데이터, 중앙에는 날짜, 시간, 일련 번호 3. 금액: 오른쪽
3	공통 - 쓰기 표준화	파일별 헤더에 댓글이 맞는지
4	공통 작성 사양	각 함수에 맞는 댓글이 있는지
5	공통- 사양 성별	각 구성 파일 관련 내용에 주석이 있는지 여부
6	공통 작성 표준화	각 논리 블록에 주석이 있는지 여부
7	Common - Writing Standards	사용되지 않은 변수 및 참조가 있습니까?
8	Common - Writing Standards	들여쓰기에는 탭을 사용하고, 탭을 4칸으로 설정하세요.
9 .자체 닫힘이 필요하지 않은 태그의 경우 input, br, img, hr 등의 닫는 태그가 허용되지 않습니다.		10 HTML-writing 규범성 태그 2:
2. HTML 태그의 사용은 태그의 의미를 따라야 합니다. 공통 태그 의미 p - 단락	강력, em - 강조	ins - 삽입 del - 삭제 abbr - 약어 code - 코드 식별 cite - 원본 작업의 제목 q - citation Blockquote - 단락 또는 긴 인용 ul - 순서가 없는 목록 ol - 순서가 있는 목록 dl,dt,dd - 정의 테이블
11	HTML 작성 표준 화	속성: 1. 속성 이름은 소문자를 사용해야 합니다. 2. 속성 값은 큰따옴표로 묶어야 합니다. 3. - 등을 권장합니다.
12	HTML-Writing Normative	코딩 1: 1. 표준 모드를 활성화하려면 HTML5 doctype을 사용하는 것이 좋습니다. 2. 제목을 선언하려면 페이지에 제목 태그가 포함되어 있어야 합니다. 3.title은 head의 직계 하위 요소여야 하며 문자 세트 선언 바로 뒤에 있어야 합니다. 예제 13
	인코딩 2 :	< link rel="shortcut icon" href="path/to/favicon. ico">; 2. 프로젝트가 모바일이거나 반응형 레이아웃인 경우 페이지의 뷰포트를 지정해야 합니다.
14	HTML 작성 표준화	소개: 1 CSS를 도입할 때 ; 2. CSS 및 JavaScript를 도입할 때 유형 속성을 지정할 필요가 없습니다(기본값이 있음). 3. head, JavaScript는 페이지 끝에 배치하거나 비동기 로딩을 사용해야 합니다. (페이지 중앙에 스크립트를 배치하면 페이지 렌더링이 차단됩니다.)
15	HTML-Writing Standardization	사진: 1 img의 src 값이 비어 있으면 금지됩니다. 지연 로딩 이미지는 기본 src도 추가해야 합니다(빈 src는 페이지를 다시 로드함) img에 불필요한 제목 속성을 추가합니다(과도한 제목은 사진 보기 환경에 영향을 미치고 페이지 크기를 증가시킵니다). 중요한 이미지에 대한 alt 속성 4. 다운로드 요구 사항이 있는 이미지는 img 태그를 사용하여 구현되고, 다운로드 요구 사항이 없는 이미지는 CSS 배경 이미지로 구현됩니다.
16	HTML-Writing Normative	형식: 1. 레이블 태그를 사용하여 제목과 연결해야 합니다. 2. 3. 주요 기능을 담당하는 버튼은 DOM에 먼저 배치되어야 합니다(권장 사항이며 특정 디자인이 우선 적용됩니다).
17	HTML 작성 표준화	비디오 및 오디오: 1 HTML5를 지원하는 브라우저에서 오디오 및 비디오 요소를 정의하기 위해 오디오 및 비디오 태그 사용을 우선시합니다. 2. 필요한 경우에만 오디오 및 비디오 자동 재생을 활성화합니다. 3. 브라우저가 를 지원하지 마세요.

		1.class, id는 모두 소문자여야 하며 단어는 -(대시)로 구분됩니다. 클래스와 ID는 해당 모듈이나 구성 요소의 내용이나 기능을 나타내야 하며, 왼쪽, 오른쪽, 가운데, 빨간색, 검은색 등과 같은 단어가 이름에 단독으로 나타나서는 안 됩니다. .class는 전역 오염을 방지하기 위해 추가되어야 합니다. g는 전역 스타일을 나타내고, m은 모듈 스타일을 나타내고, ui는 구성 요소 스타일을 나타냅니다. 세부 사항은 프로젝트 규정에 따릅니다. 4. 중요: 클래스는 허용되지 않습니다. 이는 JavaScript가 스타일 정보 없이 클래스를 생성하도록 허용하는 것입니다. 6. 페이지에서 독특해야 합니다.7. 같은 페이지, 다른 태그, 동일한 이름과 ID 사용을 피하세요(동일한 태그 사용 가능).
20	CSS 작성 표준	규칙에 여러 선택기가 포함된 경우 각 선택기 선언은 자체 줄에 있어야 합니다.
21	CSS-Writing Normative	속성 선택기의 값은 큰따옴표로 묶어야 합니다. input[name="acd"] {...}
22	CSS-writing Normative	값이 0~1 사이의 소수일 경우, 정수 부분 . 예를 들어 opacity: .8
23	CSS 작성 사양	url() 함수의 경로는 인용되지 않습니다. 예를 들어 background: url(bg.png);
24	CSS-writing Normative	길이가 0인 경우 단위를 생략해야 합니다. 예를 들어 padding: 0 5px
25	CSS 작성 사양	스타일 코드는 .css 접미사가 붙은 파일에 독립적으로 저장되어야 하며, 인터라인 스타일은 특수 스타일을 제외하고는 허용되지 않습니다. 상황.
26	CSS 작성 표준	RGB 색상 값은 16진수 표기법 #rrggbb를 사용해야 합니다. rgb()는 허용되지 않습니다.
27	CSS 작성 표준화	색상: 1. RGB 색상 값은 16진수 표기법 #aabbcc, rgb()를 사용해야 합니다. 2. 색상 값을 축약할 수 있는 경우 #fff, #000 3과 같은 축약형을 사용해야 합니다. 빨간색 녹색 및 기타 불확실한 값에는 명명된 색상 값이 허용되지 않습니다. 4. 색상 값은 모두 영문 소문자를 사용하세요.
28	CSS-Writing Standardization	글꼴 1: 1. 글꼴 계열 속성에 글꼴 계열 이름이 있는 경우 이를 사용해야 합니다. 공백, 따옴표 안에 넣어야 하며, 중국어는 엄격히 금지됩니다. 글꼴 모음 예: “Microsoft YaHei” Windows Microsoft Microsoft는 Windows Windows JhengHei를 해킹하고 있습니다.中文字幕　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　법으로) WenQuanYi Micro Hei 29 CSS 작성 표준화
글꼴 2: "앞에는 서양글꼴, 뒤에는 한문글자" back" 및 "좋은 효과(고품질/요구 충족에 더 좋음)" "글꼴 먼저, 평균 효과가 있는 글꼴 마지막" 순서로 작성하고 마지막으로 범용 글꼴 계열(serif / sans-serif)을 지정해야 합니다.		30 CSS-Writing Normality
1. Windows 플랫폼에 표시되는 크기는 12px 이상이어야 합니다.	1. 메소드/속성 이름, 변수 이름,	, 함수 이름은 카멜 표기법으로 지정해야 합니다. 2. 클래스 이름, 열거형 이름, constructor, 파스칼 이름을 사용해야 합니다. 3. 상수 이름 및 열거형 속성: IS_DEBUG_ENABLED와 같이 모두 대문자 밑줄 명명법을 사용해야 합니다.
32	JS-Writing Standards	JavaScript 프로그램은 접미사가 .js인 파일에 독립적으로 저장되어야 합니다.
33	JS-Writing Standards	한 줄에 80자를 초과하지 마세요.
34	JS-Writing Standards	전역 변수의 사용을 최소화하고 지역 변수가 전역 변수를 덮어쓰지 않도록 하세요.
35	JS-Writing Standards	공통 기능을 사용할 수 있는 경우, 공통 기능 사용 여부.
36	JS-Writing Normative	문: 1 각 간단한 문 끝에는 최대 하나의 문만 포함됩니다. ; 2.return 문 반환 값이 있는 return 문에서는 ( )(괄호)를 사용하여 반환 값을 묶어서는 안 됩니다. 표현식이 반환되는 경우 실수로 세미콜론을 추가하는 실수를 방지하기 위해 표현식은 return 키워드와 같은 줄에 있어야 합니다. 3. 프로그램의 논리적 프로세스를 쉽게 모호하게 만들 수 있는 continue 문을 사용하지 마세요. 4.eval은 JavaScript에서 가장 쉽게 남용되는 방법이므로 사용하지 마세요.
37	JS-Writing Standardization	ES5 구문은 전역 네임스페이스 오염을 방지하기 위해 독립적이고 격리된 정의 도메인을 생성하기 위해 코드를 IIFE(즉시 호출 함수 표현식)로 래핑해야 합니다.
38	JS 작성 표준	코드에 js strict 모드 'use strict' 추가
39	JS -규범적인 글쓰기	가변적 선언: 변수를 선언하려면 var 또는 let을 사용하십시오. 변수를 지정하지 않으면 암시적으로 전역 변수로 선언되므로 변수 제어가 어려워집니다.
40	JS-Program Smoothness	참과 거짓 판단을 현명하게 사용하세요. if(a == true)가 if(a)와 다르면 이 판단은 특별하게 통과됩니다. 연산이 이를 변환합니다. true 또는 false로 변환하고 다음 표현식은 모두 false를 반환합니다: false, 0, undefine, null, NaN, (빈 문자열)
41	JS-Program Smoothness	in 루프. 간단한 루프 문에 함수를 추가하면 쉽게 클로저가 형성되고 숨겨진 위험이 발생할 수 있습니다.
42	JS-Program Smoothness	명령문 블록 내에서 함수 선언을 피하세요. 엄격 모드에서는 구문 오류가 보고됩니다.
43	JS-Program Smoothness	배열과 객체 리터럴을 사용하여 배열과 객체 생성자를 대체합니다. 배열 생성자를 사용하면 사람들이 매개변수에서 실수하기 쉽습니다.
44	JS-Program Smoothness	삼항 조건부 판단(if의 단축 방법), 복잡한 상황에서 사용을 피하기 위해 삼항 연산자를 사용하여 명령문을 할당하거나 반환합니다.
45	JS 프로그램 차단 해제	문자열은 작은따옴표(')를 사용하고 큰따옴표(")를 사용하지 않습니다. 이는 와 같은 HTML 문자열을 생성할 때 매우 유용합니다. var msg = '이것은 일부 HTML '입니다. 중복된 프로그램, 다음 예는 참고용입니다.
・반복됨 초기화
47	JS 논리적 정확성	이상한 논리 없음(빈 함수 및 처리되지 않은 분기 등)
48	JS- 논리적 정확성	텍스트 입력 상자의 문자열 길이는 다음 두 가지 사항에 따라 제한됩니다. 1. 비즈니스 요구 사항인지 여부 2. 데이터베이스 필드 길이가 충족되는지 여부
49	JS-논리적 정확성	쿼리가 완료된 후 쿼리 조건은 해당 입력 상자에 유지되어야 합니다
50	JS-논리적 정확성	정렬되었습니다.
51	JS-logical 정확성	쿼리 영역의 총 항목 수는 현재 쿼리되는 모든 데이터의 총 개수여야 합니다. 현재 페이지에 표시된 항목 수 대신
52	JS 논리적 정확성	쿼리 조건 입력 상자는 쿼리하기 전에 앞뒤 공백을 제거해야 합니다