공지사항:
2025년 4월 15일 전에 Earth Engine 사용을 위해 등록된 모든 비상업용 프로젝트는 Earth Engine 액세스를 유지하기 위해
비상업용 자격 요건을 인증해야 합니다.
Earth Engine용 JavaScript 소개
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
이 튜토리얼에서는 Earth Engine 스크립트 작성을 시작하는 데 필요한 만큼의 JavaScript를 다룹니다. 자세한 JavaScript 튜토리얼은 이 Mozilla 개발자 리소스를 참고하세요. 프로그래밍 소개와 JavaScript 예시는 Eloquent JavaScript를 참고하세요. JavaScript 코딩 스타일에 관한 제안사항은 Google JavaScript 스타일 가이드를 참고하세요. 이 튜토리얼에서는 Earth Engine 코드 편집기에서 JavaScript를 작성합니다. 시작하기 전에 코드 편집기 가이드를 사용하여 코드 편집기 환경에 익숙해지세요.
Hello World!
이제 Earth Engine용 첫 번째 JavaScript를 작성할 차례입니다. Chrome 브라우저에서 code.earthengine.google.com으로 이동하여 다음을 코드 편집기에 복사합니다.
코드 편집기 (JavaScript)
print('Hello World!');
실행을 클릭하고 'Hello world!'가 콘솔 탭에 출력되는지 확인합니다. 위의 줄은 JavaScript 문입니다. JavaScript에서 문은 세미콜론으로 끝납니다. Earth Engine 프로그램은 이와 같은 일련의 문으로 구성됩니다. 코드를 삭제하지 않고 실행되지 않도록 하려면 주석을 달면 됩니다. 코드를 주석 처리하는 방법 중 하나는 실행하지 않으려는 코드 앞에 슬래시 두 개(//
)를 넣는 것입니다. 예를 들면 다음과 같습니다.
코드 편집기 (JavaScript)
// print('Hello World!');
코드에 많은 주석을 넣어 원하는 작업을 설명하는 것이 좋습니다. 더 이상 아무 작업도 하지 않는 주석 처리된 코드를 삭제하는 것도 좋습니다.
이러한 두 가지 방법 모두 코드 가독성을 개선합니다.
기본 JavaScript 데이터 유형
문자열
변수를 사용하여 객체와 기본 요소를 저장하면 코드 가독성이 향상됩니다. 예를 들어 문자열 객체를 저장하는 변수는 단일 '
또는 이중 "
따옴표로 정의됩니다 (혼합하지는 않음). 단일 따옴표가 선호됩니다. 새 문자열을 만들어 greetString
라는 변수에 저장합니다.
코드 편집기 (JavaScript)
// Use single (or double) quotes to make a string.
var greetString = 'Ahoy there!';
// Use parentheses to pass arguments to functions.
print(greetString);
숫자
변수는 var
키워드로 정의됩니다. 변수는 숫자를 저장할 수도 있습니다.
코드 편집기 (JavaScript)
// Store a number in a variable.
var number = 42;
print('The answer is:', number);
이 예에서는 print()
에 쉼표로 구분된 두 개의 인수가 주어지면 각 인수가 다른 줄에 출력됩니다.
목록
대괄호 []
를 사용하여 목록을 정의합니다. 숫자 목록입니다(예:
코드 편집기 (JavaScript)
// Use square brackets [] to make a list.
var listOfNumbers = [0, 1, 1, 2, 3, 5];
print('List of numbers:', listOfNumbers);
목록은 문자열이나 다른 객체를 저장할 수도 있습니다. 예를 들면 다음과 같습니다.
코드 편집기 (JavaScript)
// Make a list of strings.
var listOfStrings = ['a', 'b', 'c', 'd'];
print('List of strings:', listOfStrings);
사물
JavaScript의 객체는 key: value
쌍의 사전입니다. 중괄호 {}
를 사용하여 객체(또는 사전)를 만듭니다. 예를 들면 다음과 같습니다.
코드 편집기 (JavaScript)
// Use curly brackets {} to make a dictionary of key:value pairs.
var object = {
foo: 'bar',
baz: 13,
stuff: ['this', 'that', 'the other thing']
};
print('Dictionary:', object);
// Access dictionary items using square brackets.
print('Print foo:', object['foo']);
// Access dictionary items using dot notation.
print('Print stuff:', object.stuff);
키를 제공하여 사전에서 값을 가져올 수 있습니다. 이 예에서는 JavaScript 객체에 대해 이를 수행하는 방법을 보여줍니다. 나중에 Earth Engine 서버에 있는 사전의 경우 이를 수행하는 방법을 알아봅니다.
함수
함수는 작업 집합을 그룹화하여 코드 가독성과 재사용성을 개선하는 또 다른 방법입니다. function
키워드로 함수를 정의합니다. 함수 이름은 문자로 시작하고 끝에 괄호 쌍이 있습니다. 함수는 종종 함수에 수행할 작업을 알려주는 매개변수를 사용합니다. 이러한 매개변수는 괄호 ()
안에 들어갑니다. 함수를 구성하는 문 집합은 중괄호 안에 들어갑니다. return
키워드는 함수 출력이 무엇인지 나타냅니다. 함수를 선언하는 방법에는 여러 가지가 있지만 여기서는 다음과 같은 방법을 사용합니다.
코드 편집기 (JavaScript)
var myFunction = function(parameter1, parameter2, parameter3) {
statement;
statement;
statement;
return statement;
};
한 줄씩 살펴보겠습니다. 첫 번째 줄은 새 함수를 만들고 변수 myFunction
에 할당합니다. 이 변수의 이름은 무엇이든 될 수 있습니다. 이는 나중에 함수를 호출하는 방법을 정의합니다. 함수 이름 뒤에 오는 괄호 안의 용어 (예: parameter1, parameter2, parameter3)는 매개변수 이름이며, 어떤 이름으로든 지정할 수 있습니다. 하지만 함수 외부의 코드와 다른 고유한 이름을 지정하는 것이 좋습니다. 이름이 무엇이든 이러한 이름은 함수가 호출될 때 함수에 전달되는 값을 참조하는 데 함수가 사용하는 이름입니다. 함수에 전달된 매개변수의 값을 인수라고 합니다. 함수는 함수 외부에서 선언된 변수 (전역 변수)를 사용할 수 있지만 함수 인수는 함수 외부에서 표시되지 않습니다. 함수는 필요한 만큼의 매개변수를 사용할 수 있으며, 0개도 가능합니다. 다음은 인수를 반환하는 함수의 간단한 예입니다.
코드 편집기 (JavaScript)
// The reflect function takes a single parameter: element.
var reflect = function(element) {
// Return the argument.
return element;
};
print('A good day to you!', reflect('Back at you!'));
다음은 사용자 정의 함수의 예입니다. 또한 기본 제공되는 Earth Engine 함수도 많이 있습니다. 코드 편집기 문서 탭을 살펴보고 이러한 기본 제공 함수에 대해 알아보세요. 다음은 Earth Engine 함수의 매우 간단한 예입니다.
코드 편집기 (JavaScript)
var aString = ee.Algorithms.String(42);
다음 섹션에서는 Earth Engine 객체 및 메서드에 대해 자세히 알아봅니다.
달리 명시되지 않는 한 이 페이지의 콘텐츠에는 Creative Commons Attribution 4.0 라이선스에 따라 라이선스가 부여되며, 코드 샘플에는 Apache 2.0 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 Google Developers 사이트 정책을 참조하세요. 자바는 Oracle 및/또는 Oracle 계열사의 등록 상표입니다.
최종 업데이트: 2025-07-26(UTC)
[null,null,["최종 업데이트: 2025-07-26(UTC)"],[[["\u003cp\u003eThis tutorial provides a basic introduction to JavaScript for use within the Google Earth Engine Code Editor.\u003c/p\u003e\n"],["\u003cp\u003eIt covers fundamental JavaScript concepts like variables, data types (strings, numbers, lists, objects), and functions.\u003c/p\u003e\n"],["\u003cp\u003eUsers are encouraged to utilize the Code Editor's features like the Console and Docs tabs for a better experience.\u003c/p\u003e\n"],["\u003cp\u003eEarth Engine programs consist of JavaScript statements, and the tutorial provides examples for basic operations.\u003c/p\u003e\n"],["\u003cp\u003eThe tutorial serves as a starting point for learning Earth Engine, with more advanced topics covered in subsequent tutorials.\u003c/p\u003e\n"]]],["This tutorial introduces basic JavaScript concepts within the Earth Engine Code Editor. Key actions include writing and running code, like `print('Hello World!');`, using comments (`//`), and defining variables with `var`. It covers data types such as strings (using quotes), numbers, lists (using `[]`), and objects (using `{}`). Functions are explained using `function`, with parameters and the `return` statement. It also highlights built-in Earth Engine functions and the location of their documentation.\n"],null,["# Introduction to JavaScript for Earth Engine\n\nThis tutorial covers just enough\n[JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript/About_JavaScript)\nto get you started writing Earth Engine scripts. For more thorough JavaScript tutorials,\nsee [these Mozilla developer\nresources](https://developer.mozilla.org/en-US/docs/Web/JavaScript). For an introduction to programming, with examples in JavaScript, see\n[Eloquent JavaScript](http://eloquentjavascript.net/). For suggestions\non JavaScript coding style, see the\n[Google JavaScript Style\nGuide](http://google.github.io/styleguide/javascriptguide.xml). In this tutorial, you're going to write JavaScript in the Earth Engine\n[Code Editor](https://code.earthengine.google.com/). Before getting started,\nuse [the Code Editor guide](/earth-engine/guides/playground) to get familiar\nwith the Code Editor environment.\n\nHello World!\n------------\n\nTime to write your first JavaScript for Earth Engine! In your Chrome browser, go to\n[code.earthengine.google.com](https://code.earthengine.google.com/) and copy\nthe following into the [Code Editor](/earth-engine/guides/playground):\n\n### Code Editor (JavaScript)\n\n```javascript\nprint('Hello World!');\n```\n\nClick **Run** and observe that 'Hello world!' is printed to the\n[Console tab](/earth-engine/guides/playground#console-tab). The line above is a JavaScript\nstatement. In JavaScript, statements end in a semicolon. Earth Engine programs are made\nup of a set of statements like this one. You can prevent code from running without\ndeleting it by commenting it. One of the ways to comment out code is by putting two\nforward slashes `//` before the code that you don't want to run. For example:\n\n### Code Editor (JavaScript)\n\n```javascript\n// print('Hello World!');\n```\n\nIt's good practice to put lots of comments in your code, to describe what you're trying\nto do. It's also good to delete commented code that doesn't do anything anymore.\nBoth these practices will improve code readability.\n\nBasic JavaScript data types\n---------------------------\n\n### Strings\n\nUsing variables to store objects and primitives helps code readability. For example,\na variable that stores a string object is defined by single `'` or double\n`\"` quotes (but don't mix them), with\n[single quotes\npreferred](https://google.github.io/styleguide/javascriptguide.xml#Strings). Make a new string and store it in a variable called\n`greetString`:\n\n\n### Code Editor (JavaScript)\n\n```javascript\n// Use single (or double) quotes to make a string.\nvar greetString = 'Ahoy there!';\n// Use parentheses to pass arguments to functions.\nprint(greetString);\n```\n\n### Numbers\n\nNote that variables are defined with the keyword `var`. Variables can also\nstore numbers:\n\n### Code Editor (JavaScript)\n\n```javascript\n// Store a number in a variable.\nvar number = 42;\nprint('The answer is:', number);\n```\n\nIn this example, observe that when `print()` is given two arguments separated\nby commas, each argument is printed on a different line.\n\n### Lists\n\nDefine lists with square brackets `[]`. A list of numbers, for example:\n\n### Code Editor (JavaScript)\n\n```javascript\n// Use square brackets [] to make a list.\nvar listOfNumbers = [0, 1, 1, 2, 3, 5];\nprint('List of numbers:', listOfNumbers);\n```\n\nLists can also store strings or other objects. For example:\n\n\n### Code Editor (JavaScript)\n\n```javascript\n// Make a list of strings.\nvar listOfStrings = ['a', 'b', 'c', 'd'];\nprint('List of strings:', listOfStrings);\n```\n\n### Objects\n\nObjects in JavaScript are dictionaries of `key: value` pairs. Make an object\n(or dictionary) using curly brackets `{}`, for example:\n\n### Code Editor (JavaScript)\n\n```javascript\n// Use curly brackets {} to make a dictionary of key:value pairs.\nvar object = {\n foo: 'bar',\n baz: 13,\n stuff: ['this', 'that', 'the other thing']\n};\nprint('Dictionary:', object);\n// Access dictionary items using square brackets.\nprint('Print foo:', object['foo']);\n// Access dictionary items using dot notation.\nprint('Print stuff:', object.stuff);\n```\n\nNote that you can get a value from a dictionary by supplying the key. This example\nshows you how to do that for JavaScript objects. Later you'll learn how to do it for\ndictionaries that are on the Earth Engine server.\n\nFunctions\n---------\n\nFunctions are another way to improve code readability and reusability by grouping sets\nof operations. Define a function with the `function` keyword. Function names\nstart with a letter and have a pair of parentheses at the end. Functions often take\n*parameters* which tell the function what to do. These parameters go inside the\nparentheses `()`. The set of statements making up the function go inside curly\nbrackets. The `return` keyword indicates what the function output is. There\nare several ways to declare a function, but here we'll use something like this:\n\n### Code Editor (JavaScript)\n\n```javascript\nvar myFunction = function(parameter1, parameter2, parameter3) {\n statement;\n statement;\n statement;\n return statement;\n};\n```\n\nLet's consider the lines one by one. The first line creates a new function and assigns\nit to the variable `myFunction`. This variable could have been named\nanything. It defines how to call the function later. The terms in the parentheses after\nthe function name (i.e. parameter1, parameter2, parameter3) are the parameter names and\ncould have been named anything as well, though it's good practice to give them unique names\nthat are different from the code outside the function. Whatever you name them, these are\nthe names that function will use to refer to the values that are passed into the function\nwhen it is called. The value of a parameter once it's been passed into a function is\ncalled an *argument* . Although functions can use variables declared outside\nthe function (*global* variables), function arguments are not visible outside the\nfunction. Functions can take as many parameters as you need, even zero. Here's a simple\nexample of a function that just returns its argument:\n\n### Code Editor (JavaScript)\n\n```javascript\n// The reflect function takes a single parameter: element.\nvar reflect = function(element) {\n // Return the argument.\n return element;\n};\nprint('A good day to you!', reflect('Back at you!'));\n```\n\nThis is an example of a user-defined function. There are also lots of built-in Earth\nEngine functions. Explore the Code Editor [Docs\ntab](/earth-engine/guides/playground#api-reference-docs-tab) to learn about these built-in functions. Here's a very simple example of an\nEarth Engine function:\n\n### Code Editor (JavaScript)\n\n```javascript\nvar aString = ee.Algorithms.String(42);\n```\n\nIn the next section, learn more about [Earth Engine Objects\nand Methods](/earth-engine/tutorials/tutorial_js_02)."]]