This page was translated from English by the community.Learn more and join the MDN Web Docs community.
Solve common problems in your JavaScript code
다음의 링크들은 당신의 JavaScript 코드가 정상적으로 작동할 수 있게 고쳐야되는 흔한 문제들의 해결책을 제시한다.
In this article
초보자들의 흔한 실수들
>스펠링과 대소문자를 제대로 해라
코드가 작동하지 않거나 브라우저가 무언가가 undefined라고 불평하면 모든 변수 이름, 함수 이름 등을 정확하게 입력했는지 확인하십시오.
문제를 일으키는 몇 가지 일반적인 내장 브라우저 함수는 다음과 같습니다.
| 올바른 | 잘못된 |
|---|---|
getElementsByTagName() | getElementbyTagName() |
getElementsByName() | getElementByName() |
getElementsByClassName() | getElementByClassName() |
getElementById() | getElementsById() |
세미콜론의 위치
세미콜론의 위치가 잘못 되지 않았는지 확인하세요. 예를들어:
| 올바른 | 잘못된 |
|---|---|
elem.style.color = 'red'; | elem.style.color = 'red;' |
함수
함수와 관련하여 실수할 수 있는 것들이 많이 있습니다.
가장 흔한 실수는 함수를 선언하고 어디서도 호출하지 않는 것입니다. 예를 들어:
function myFunction() { alert("This is my function.");}위 코드는 호출하지 않는 이상 아무것도 하지 않습니다.
myFunction();함수 스코프
함수는 각자의 스코프가 있음을 명심하세요 — 변수를 전역으로 선언하거나 함수에서값을 리턴하지 않는한 함수 밖에서 함수 내부에 설정된 변수 값에 접근 할 수 없습니다. (즉, 어떠한 함수 내에서도 접근 안됨)
리턴 문 이후 코드 실행
함수 밖으로 값을 리턴할 때, JavaScript 인터프리터가 함수를 완전히 빠져나감을 명심하세요. — 리턴 문 이후에 선언된 코드는 절대로 실행되지 않습니다.
사실, 몇몇 브라우저들은 (Firefox 처럼) 리턴 문 이후에 코드가 있다면 개발자 콘솔에 에러 메세지를 줍니다. Firefox는 "unreachable code after return statement" 라고 알려줍니다.
오브젝트 표기 vs 일반적 할당
보통 자바스크립테어서 무언가를 할당하려고 할때, 단일 등호 기호를 사용합니다. 예:
const myNumber = 0;하지만, 이 방법은오브젝트에선 동작하지 않습니다. — 오브젝트에선 멤버와 값 사이를 콜론으로 구분하고, 각 멤버들은 콤마로 구분합니다, 예를 들어:
const myObject = { name: "Chris", age: 38,};기본 정의
Basic use cases
>General
Variables
Math
- What types of number do you have to deal with in web development?
- How do you do basic math in JavaScript?
- What is operator precedence, and how is it handled in JavaScript?
- How do you increment and decrement values in JavaScript?
- How do you compare values in JavaScript? (e.g. to see which one is bigger, or to see if one value is equal to another).
Strings
- How do you create a string in JavaScript?
- Do you have to use single quotes or double quotes?
- How do you escape characters in strings?
- How do you join strings together?
- Can you join strings and numbers together?
- How do you find the length of a string?
- How you find what character is at a certain position in a string?
- How do you find and extract a specific substring from a string?
- How do you change the case of a string?
- How do you replace one specific substring with another?
Arrays
Debugging JavaScript
- What are the basic types of error?
- What are browser developer tools, and how do you access them?(en-US)
- How do you log a value to the JavaScript console?(en-US)
- How do you use breakpoints, and other JavaScript debugging features?(en-US)
For more information on JavaScript debugging, seeHandling common JavaScript problems(en-US); also seeOther common errors for a description of common errors.
Making decisions in code
- How do you execute different blocks of code, depending on a variable's value or other condition?
- How do you use if ...else statements?
- How do nest one decision block inside another?
- How do you use AND, OR, and NOT operators in JavaScript?
- How do you conveniently handle a large number of choices for one condition?
- How do you use a ternary operator to make a quick choice between two options based on a true or false test?
Looping/iteration
- How do you run the same bit of code over and over again?
- How do you exit a loop before the end if a certain condition is met?
- How do you skip to the next iteration of a loop if a certain condition is met?
- How do you use while and do ... while loops?
- How to iterate over the elements in an array
- How to iterate over the elements in a multidimensional array
- How to iterate over the members in an object
- How to iterate over the members of an object nested inside an array
Intermediate use cases
>Functions
- How do you find functions in the browser?
- What is the difference between a function and a method?
- How do you create your own functions?
- How do you run (call, or invoke) a function?
- What is an anonymous function?
- How do you specify parameters (or arguments) when invoking a function?
- What is function scope?
- What are return values, and how do you use them?
Objects
- How do you create an object?
- What is dot notation?
- What is bracket notation?
- How do you get and set the methods and properties of an object?
- What is
this, in the context of an object? - What is object-oriented programming?
- What are constructors and instances, and how do you create them?
- What different ways are there to create objects in JavaScript?
JSON
Events
- What are event handlers and how do you use them?
- What are inline event handlers?
- What does the
addEventListener()function do, and how do you use it? - Which mechanism should I use to add event code to my web pages?
- What are event objects, and how do you use them?
- How do you prevent default event behaviour?
- How do events fire on nested elements? (event propagation, also related — event bubbling and capturing)
- What is event delegation, and how does it work?