Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 0 additions & 31 deletions 1-js/04-object-basics/04-object-methods/article.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,19 +32,11 @@ user.sayHi = function() {
user.sayHi(); // 안녕하세요!
```

<<<<<<< HEAD
함수 표현식으로 함수를 만들고, 객체 프로퍼티 `user.sayHi`에 함수를 할당해 주었습니다.

이제 객체에 할당된 함수를 호출하면 user가 인사를 해줍니다.

이렇게 객체 프로퍼티에 할당된 함수를 *메서드(method)* 라고 부릅니다.
=======
Here we've just used a Function Expression to create a function and assign it to the property `user.sayHi` of the object.

Then we can call it as `user.sayHi()`. The user can now speak!

A function that is a property of an object is called its *method*.
>>>>>>> upstream/master

위 예시에선 `user`에 할당된 `sayHi`가 메서드이죠.

Expand All @@ -58,13 +50,8 @@ let user = {
*!*
// 함수 선언
function sayHi() {
<<<<<<< HEAD
alert("안녕하세요!");
};
=======
alert("Hello!");
}
>>>>>>> upstream/master

// 선언된 함수를 메서드로 등록
user.sayHi = sayHi;
Expand Down Expand Up @@ -94,11 +81,7 @@ user = {
// 단축 구문을 사용하니 더 깔끔해 보이네요.
user = {
*!*
<<<<<<< HEAD
sayHi() { // "sayHi: function()"과 동일합니다.
=======
sayHi() { // same as "sayHi: function(){...}"
>>>>>>> upstream/master
*/!*
alert("Hello");
}
Expand All @@ -107,11 +90,7 @@ user = {

위처럼 `function`을 생략해도 메서드를 정의할 수 있습니다.

<<<<<<< HEAD
일반적인 방법과 단축 구문을 사용한 방법이 완전히 동일하진 않습니다. 객체 상속과 관련된 미묘한 차이가 존재하는데 지금으로선 이 차이가 중요하지 않기 때문에 넘어가도록 하겠습니다.
=======
To tell the truth, the notations are not fully identical. There are subtle differences related to object inheritance (to be covered later), but for now they do not matter. In almost all cases, the shorter syntax is preferred.
>>>>>>> upstream/master

## 메서드와 this

Expand Down Expand Up @@ -181,24 +160,14 @@ let user = {
let admin = user;
user = null; // user를 null로 덮어씁니다.

<<<<<<< HEAD
admin.sayHi(); // sayHi()가 엉뚱한 객체를 참고하면서 에러가 발생했습니다.
=======
*!*
admin.sayHi(); // TypeError: Cannot read property 'name' of null
*/!*
>>>>>>> upstream/master
```

`alert` 함수가 `user.name` 대신 `this.name`을 인수로 받았다면 에러가 발생하지 않았을 겁니다.

## 자유로운 this

<<<<<<< HEAD
자바스크립트의 `this`는 다른 프로그래밍 언어의 `this`와 동작 방식이 다릅니다. 자바스크립트에선 모든 함수에 `this`를 사용할 수 있습니다.
=======
In JavaScript, keyword `this` behaves unlike most other programming languages. It can be used in any function, even if it's not a method of an object.
>>>>>>> upstream/master

아래와 같이 코드를 작성해도 문법 에러가 발생하지 않습니다.

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,7 @@ importance: 2

# 함수 두 개로 동일한 객체 만들기

<<<<<<< HEAD
`new A()==new B()`가 성립 가능한 함수 `A`와 `B`를 만드는 게 가능할까요?
=======
Is it possible to create functions `A` and `B` so that `new A() == new B()`?
>>>>>>> upstream/master

```js no-beautify
function A() { ... }
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,9 @@ importance: 5

아래와 같은 세 개의 메서드를 가진 생성자 함수, `Calculator`를 만들어보세요.

<<<<<<< HEAD
- `read()` -- `prompt` 함수를 이용해 사용자로부터 값 두 개를 받고, 이를 객체 프로퍼티에 저장합니다.
- `sum()` -- 프로퍼티에 저장된 값 두 개를 더한 후 반환합니다.
- `mul()` -- 프로퍼티에 저장된 값 두 개를 곱한 후 반환합니다.
=======
- `read()` prompts for two values and saves them as object properties with names `a` and `b` respectively.
- `sum()` returns the sum of these properties.
- `mul()` returns the multiplication product of these properties.
>>>>>>> upstream/master

예시:

Expand Down
24 changes: 0 additions & 24 deletions 1-js/04-object-basics/06-constructor-new/article.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,6 @@
# new 연산자와 생성자 함수

<<<<<<< HEAD
객체 리터럴 `{...}` 을 사용하면 객체를 쉽게 만들 수 있습니다. 그런데 개발을 하다 보면 유사한 객체를 여러 개 만들어야 할 때가 생기곤 합니다. 복수의 사용자, 메뉴 내 다양한 아이템을 객체로 표현하려고 하는 경우가 그렇죠.
=======
The regular `{...}` syntax allows us to create one object. But often we need to create many similar objects, like multiple users or menu items and so on.
>>>>>>> upstream/master

`'new'` 연산자와 생성자 함수를 사용하면 유사한 객체 여러 개를 쉽게 만들 수 있습니다.

Expand Down Expand Up @@ -68,17 +64,10 @@ let user = {

생성자의 의의는 바로 여기에 있습니다. 재사용할 수 있는 객체 생성 코드를 구현하는 것이죠.

<<<<<<< HEAD
잠깐! 모든 함수는 생성자 함수가 될 수 있다는 점을 잊지 마시기 바랍니다. `new`를 붙여 실행한다면 어떤 함수라도 위에 언급된 알고리즘이 실행됩니다. 이름의 '첫 글자가 대문자'인 함수는 `new`를 붙여 실행해야 한다는 점도 잊지 마세요. 공동의 약속이니까요.
Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

간결함을 위해 '시'를 붙이지 않고 "모든 함수는 생성자 함수가 될 수 있다는 점을 잊지 마세요."로 하는 것이 어떨까요?


````smart header="new function() { ... }"
재사용할 필요가 없는 복잡한 객체를 만들어야 한다고 해봅시다. 많은 양의 코드가 필요할 겁니다. 이럴 땐 아래와 같이 코드를 익명 생성자 함수로 감싸주는 방식을 사용할 수 있습니다.
=======
Let's note once again -- technically, any function (except arrow functions, as they don't have `this`) can be used as a constructor. It can be run with `new`, and it will execute the algorithm above. The "capital letter first" is a common agreement, to make it clear that a function is to be run with `new`.

````smart header="new function() { ... }"
If we have many lines of code all about creation of a single complex object, we can wrap them in an immediately called constructor function, like this:
>>>>>>> upstream/master

```js
// create a function and immediately call it with new
Expand All @@ -92,11 +81,7 @@ let user = new function() {
};
```

<<<<<<< HEAD
위 생성자 함수는 익명 함수이기 때문에 어디에도 저장되지 않습니다. 처음 만들 때부터 단 한 번만 호출할 목적으로 만들었기 때문에 재사용이 불가능합니다. 이렇게 익명 생성자 함수를 이용하면 재사용은 막으면서 코드를 캡슐화 할 수 있습니다.
=======
This constructor can't be called again, because it is not saved anywhere, just created and called. So this trick aims to encapsulate the code that constructs the single object, without future reuse.
>>>>>>> upstream/master
````

## new.target과 생성자 함수
Expand All @@ -107,11 +92,7 @@ This constructor can't be called again, because it is not saved anywhere, just c

`new.target` 프로퍼티를 사용하면 함수가 `new`와 함께 호출되었는지 아닌지를 알 수 있습니다.

<<<<<<< HEAD
일반적인 방법으로 함수를 호출했다면 `new.target`은 undefined를 반환합니다. 반면 `new`와 함께 호출한 경우엔 `new.target`은 함수 자체를 반환해줍니다.
=======
It is undefined for regular calls and equals the function if called with `new`:
>>>>>>> upstream/master

```js run
function User() {
Expand Down Expand Up @@ -189,13 +170,8 @@ alert( new SmallUser().name ); // 원숭이

`return`문이 있는 생성자 함수는 거의 없습니다. 여기선 튜토리얼의 완성도를 위해 특이 케이스를 소개해보았습니다.

<<<<<<< HEAD
````smart header="괄호 생략하기"
인수가 없는 생성자 함수는 괄호를 생략해 호출할 수 있습니다.
=======
````smart header="Omitting parentheses"
By the way, we can omit parentheses after `new`:
>>>>>>> upstream/master

```js
let user = new User; // <-- 괄호가 없음
Expand Down
Loading