>웹 프론트엔드 >JS 튜토리얼 >JavaScript 학습 이력 및 경험 요약_기본 지식

JavaScript 학습 이력 및 경험 요약_기본 지식

WBOY
WBOY원래의
2016-05-16 18:21:16924검색

1. 서문
과거에는 양식 유효성 검사, 플로팅 광고 등 간단한 웹페이지 효과를 수행하는 데에만 JavaScript가 사용되었으므로 그 부분에서는 JavaScript를 심각하게 받아들이지 않았습니다. 시간. AJAX가 대중화되면서 사람들은 JavaScript를 사용하면 사용자에게 더 나은 경험을 제공할 수 있다는 사실을 알게 되었고, 이러한 이점을 활용하여 대규모 웹 게임을 개발할 수도 있게 되었습니다. 따라서 이 작은 언어는 진지하게 받아들여졌습니다. 요즘에는 많은 회사에서 전문적인 JavaScript 엔지니어를 채용합니다. 일반적으로 JavaScript는 WEB 프론트엔드 개발에 필수적인 기술입니다. JavaScriptr의 장점을 간략하게 소개한다고 해서 모두가 배운다는 의미는 아니며, 심지어 잘 배운다는 의미도 아닙니다. 관심은 한 가지 일에 집중하고 그것을 하게 만드는 가장 좋은 선생님이라고 생각합니다. 잘. . 또한, 모든 사람들은 작은 언어가 큰 일을 할 수 있다고 믿어야 합니다. 저는 Greasemonkey를 사용하여 몇 가지 매우 실용적인 도구를 작성했습니다. 예를 들어 JavaScript Greasemonkey를 사용하여 온라인 웹 게임용 플러그인을 작성할 수 있습니다. 제가 자바스크립트를 배우게 된 과정과 경험에 대해 이야기해보겠습니다.

2. 시작하기
1. DIV CSS 레이아웃 배우기

DIV CSS를 사용하여 표준 웹 페이지를 레이아웃하면 프런트엔드 XHTML 코드가 줄어들고 예를 들어 3행 3열로 구성된 목록을 표시하려는 경우 기존 테이블 레이아웃을 사용했는데 이제 JavaScript를 사용하여 동적으로 생성해야 하는 경우에는 JavaScript를 사용하여 구조를 더 명확하게 만드는 것이 좋습니다. 이 목록에는 루프 중첩이 필요합니다. li 구조를 사용하고 CSS 플로팅 레이아웃을 추가하면 루프 하나면 충분합니다. 물론 WEB 표준화가 반드시 테이블을 사용할 수 없다는 것을 의미하지는 않습니다. 즉, 명확한 구조의 XHTML을 사용하면 JavaScript 효과나 기능을 프로젝트에 더 쉽게 통합할 수 있다는 것입니다.

2. 여러 가지 개발 및 테스트 도구를 숙지하세요

개발자로서 테스트 도구에 익숙해지는 것은 특히 대규모 프로젝트의 경우 문제를 찾고 해결하는 데 도움이 됩니다. . 이는 프로젝트의 경우 특히 그렇습니다. 먼저 가장 일반적으로 사용되는 두 가지 JavaScript 및 XHTML 개발 및 테스트 도구인 Web Developer와 Firebug를 추천하겠습니다.

3. JavaScript의 각 메소드의 기능을 숙지하세요

이 요구 사항은 C#과 같은 대규모 언어의 경우 실제로 적용되는 것으로 생각됩니다. JAVA, 왜냐하면 이러한 언어 라이브러리는 너무 커서 누구도 완전히 기억할 수 없으며 모두 기억할 필요도 없기 때문입니다. 예를 들어 JAVA를 사용하여 웹 페이지를 구축하고 휴대폰 개발은 다양한 클래스 라이브러리에 중점을 둡니다. JavaScript는 그렇지 않습니다. 실제로 내장된 메소드와 함수가 많지 않습니다. 먼저 익숙해지면 쉽게 개발할 수 있습니다. 예를 들어 처음에는 JavaScript에 Trim()이 있다고 생각할 수도 있습니다. 많은 언어가 가지고 있는 메소드는 줄의 시작과 끝 부분에 있는 공백을 제거하기 위한 것입니다. JavaScript 내장 함수 라이브러리를 이해하면 이러한 메소드를 JavaScript에서 직접 구현해야 한다는 것을 알게 될 것입니다. 또 다른 예로, 좀 더 강력한 다른 언어에서 JavaScript로 전환하면 JavaScript에 MD5 암호화 방법이 있어야 한다고 생각할 수 있습니다. 물론 이것은 존재하지 않지만 누군가 JavaScript에 그러한 방법, 즉 JavaScript MD5를 구현했습니다. 결국 JavaScript에는 내장된 메소드가 거의 없지만 많은 재능 있는 사람들이 JavaScript 기능을 향상시키기 위해 몇 가지 새로운 메소드를 작성했습니다. 예를 들어 프로토타입 프레임워크는 주로 기본 JavaScript 기능의 확장을 프로토타입합니다.

4. DOM 프로그래밍 이해

JavaScript는 순수한 데이터 처리 논리를 작성하는 것 외에도 XHTML 구조와 콘텐츠를 동적으로 변경하는 데 더 중점을 두기 때문에 DOM 프로그래밍을 이해하는 것이 JavaScript를 배우는 데 더 중요한 과정입니다. 인터페이스의 동적 업데이트 목적을 달성하기 위해 이러한 작업은 모두 DOM 프로그래밍에 의존합니다. jQuery 프레임워크는 이러한 측면을 매우 잘 캡슐화하여 풍부한 DOM 작업 방법을 제공하므로 페이지 어디에서나 DOM 노드(XHTML 태그)를 쉽게 찾은 다음 관련 작업(추가, 삭제, 수정, 확인)을 수행할 수 있습니다. 다른 언어로 XML 문서를 운영해 본 경험이 있는 분들이라면 빠르게 시작할 수 있을 것이라 믿습니다.

5. AJAX에 문의하고 사용하기

오늘날 AJAX를 사용하지 않고 JavaScript를 배우면 JavaScript의 장점이 묻어나게 됩니다(AJAX 자체는 JavaScript 콘텐츠로 간주되지 않습니다). AJAX는 사용자와 서버 모두에게 더 나은 사용자 경험을 제공합니다. 가장 일반적인 응용 프로그램 시나리오는 등록 페이지에서 사용자 이름 가용성을 사전 감지하는 것입니다. 정보를 입력하고 양식을 제출하면 서버는 사용자에게 사용자가 등록되었음을 알리고 사용자에게 정보를 다시 입력하도록 요구합니다. 이는 사용자가 입력한 사용자 이름 10개 중 절반에 해당하므로 대규모 다중 사용자 웹사이트에서는 매우 치명적입니다. 등록되었을 수 있습니다. 서버의 경우 웹 페이지 트래픽을 줄이세요. AJAX 이후에는 일반적으로 데이터가 요청 시 로드되고 로컬 업데이트로 인해 전체 페이지가 다시 로드되지 않기 때문입니다. 예를 들어, 웹페이지가 3개의 화면 높이를 차지하는 경우 기본적으로 첫 번째 화면의 콘텐츠만 로드할 수 있으며, 사용자가 스크롤 막대를 아래로 당길 때 두 번째 및 세 번째 화면의 콘텐츠를 로드할 수 있습니다. 또한 WEB 온라인 지도 애플리케이션도 AJAX 사용의 예입니다.

3. 개선
1. JavaScript에 대한 심층적 이해

JavaScript의 기능과 방향은 실제 객체지향과는 많이 다릅니다. 차이점은 항상 현재 개체를 가리키지 않고 변경된다는 것입니다. 이 문제를 주의하지 않으면 올바른 것처럼 보이는 코드가 실행되지 않거나 오류가 발생하는 등의 문제가 발생할 수 있습니다.

2. JavaScript OOP 프로그래밍 배우기

OOP는 프로그래머가 더 체계적으로 생각하고 코드를 더 명확하게 구성할 수 있게 해주는 좋은 것입니다. JavaScript는 OOP일 수도 있지만 일부 기존 OOP 언어와는 상당히 다르기 때문에 JavaScript OOP에 익숙해지려면 약간의 노력이 필요합니다.

3. 클로저 이해하기

자바스크립트 클로저는 많이 이야기되는 주제이기도 하지만, 이 기능으로 인해 언어가 더욱 유연해졌습니다.

4. 표준화된 개발을 배우세요

회사에서 개발을 한다는 것은 팀과 떼려야 뗄 수 없는 일이죠. , 각 구성원은 반드시 코딩을 해야 하며, 이는 모든 회사의 프로그래머에게 기본 요구 사항이기도 한 특정 표준을 준수해야 합니다. 사양은 일반적으로 변수 이름 지정, 파일 구성, 주석 사양 등을 참조합니다. 이 지식은 다른 언어의 사양과 유사합니다.

5. 알고리즘 책 찾아서 읽어보세요

언어를 배우고 사용하는 것은 어렵지 않은 것 같아요. 몇 가지 복잡한 문제를 해결하세요. 일부 복잡한 문제를 해결하기 위해 일부 알고리즘 구현은 중국과학원의 중국어 단어 분할 구현 및 게임에서 일반적으로 사용되는 자동 경로 찾기 A* 알고리즘과 같이 팀에서 수행할 수 있습니다. . 아마도 JavaScript 개발에서는 이러한 복잡한 문제가 발생하지 않을 것이라고 생각할 수도 있습니다. 실제로 어떤 프로젝트를 수행하고 있는지에 따라 다릅니다. 알고리즘 책을 읽고 몇 가지 일반적인 문제에 대한 해결책을 이해하면 개발 과정에서 자연스럽게 더 강력한 사람이 될 것입니다. 또한, 알고리즘에 익숙해지면 향후 다른 개발 언어를 접하는 데에도 분명히 도움이 될 것입니다.

4. 습관
1. 호환성 및 BUG 문제에 주의하세요.

CSS 및 JavaScript 브라우저 호환성 문제에 주의하는 것이 가장 좋습니다. 즉, BUG는 매우 이상합니다. 이러한 문제의 경우 브라우저는 어디가 잘못되었는지 묻지 않으며 IDE도 묻지 않습니다. 특히 CSS 호환성 문제로 인해 오랫동안 정체될 수 있습니다. 개발 과정에서 이러한 문제가 발생하면 해결할 수 없습니다. 이전에 비슷한 문제를 해결했더라도 나중에 다시 직면할 수 있기 때문에 기억력을 강화하기 위해 이전에 메모를 하지 않은 경우 이러한 호환성 문제가 한두 가지가 아니기 때문에 다시 고통을 겪게 됩니다. , 임시 기억 효과는 분명하지 않습니다. 내 경험에 따르면 IE6에서는 많은 문제가 발생합니다. 이제 Microsoft 자체도 IE6의 종말을 가속화하기를 희망하고 있습니다. 이는 물론 프런트엔드 개발에 있어 좋은 소식입니다.

2. jQuery와 같은 우수한 코드를 읽는 것은 확실히 자신을 향상시키는 좋은 방법입니다. 일부 기능의 구현 아이디어. 예를 들어 jQuery는 배울 가치가 있는 JavaScript 프레임워크입니다. 물론, 이러한 전문적인 JavaScript 프레임워크를 읽으려면 JavaScript에 대한 탄탄한 기초가 있어야 합니다. 그렇지 않으면 읽는 과정에서 너무 많은 질문에 직면하게 되어 자신감에 타격을 줄 수도 있습니다.

4. 참고
1. JavaScript를 시작하기 전에 직접 JavaScript 프레임워크를 사용하지 마세요.

JavaScript 기초가 없다면 개발용 JavaScript 프레임워크를 사용하지 마세요. 예를 들어 jQuery를 사용하여 점으로 연결된 문장을 직접 작성한다면 이것이 일종의 JavaScript 구문이라고 생각하십니까? 또 다른 예로, 프로토타입을 사용한다면 프레임워크 확장 뒤의 기본 클래스 메서드가 JavaScript에 내장되어 있다고 생각하지 마세요. 저는 JavaScript 프레임워크가 효율성을 향상시키기 위해 사용된다고 생각하며, JavaScript를 시작할 때 배워야 할 것은 절대 아닙니다.

2. 온라인에서 찾은 많은 예제는 크로스 브라우저와 호환되지 않을 수 있습니다

N년 전 한 네티즌이 작성한 JavaScript 효과 소스 코드가 많이 있으므로 IE가 세상이었습니다. 일부 프런트 엔드는 스크립트의 브라우저 간 호환성 문제를 해결하기에는 너무 게으르므로 작성된 스크립트를 IE에만 ​​적용할 수 있습니다. 그러한 코드를 받았을 때, 헛소리하거나 불평하지 마십시오. 이 코드는 쓸모가 없기 때문입니다. JavaScript 크로스 브라우저 호환성 문제를 이해한다면 코드를 약간만 수정하면 쉽게 사용할 수 있을 것입니다. 호환성이 더 좋습니다.


5. 관련 자료
"
JavaScript 개발 사양 요구 사항
"

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.