# input, change 이벤트와 and,or 연산자

이벤트 리스너를 설명하는 시간에 잠깐 보고 지나간 것

그 중에 input과 change가 있다.

```javascript
$('#email').on('input', function (){
   console.log("1");
});

$('#email').on('change', function (){
   console.log("2");
});

```

🎈input은 입력이 일어날 때마다 동작함

🎈change는 input창의 focus를 잃었을 때 동작함

💎 if 문 안에는 true/false 값을 넣어야 작동한다.

<div><figure><img src="https://3814826491-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJyHOwztPxBT3bLpisjCt%2Fuploads%2FPUs1qvmCtMAJNQBcW4Uy%2FScreenshot_4.png?alt=media&#x26;token=33865765-6779-4625-8d44-65bedc2f89f5" alt=""><figcaption><p>boolean 타입</p></figcaption></figure> <figure><img src="https://3814826491-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJyHOwztPxBT3bLpisjCt%2Fuploads%2FD51v3m8cLmWerqnPyqvq%2FScreenshot_5.png?alt=media&#x26;token=36178ed9-4820-4071-a4eb-7ff35d6acc2e" alt=""><figcaption><p>number 타입</p></figcaption></figure> <figure><img src="https://3814826491-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJyHOwztPxBT3bLpisjCt%2Fuploads%2F0AIP3dJhMwdhYjKZnaxa%2FScreenshot_6.png?alt=media&#x26;token=60777076-2aff-4f71-89a5-74afe9edb602" alt=""><figcaption><p>string 타입</p></figcaption></figure></div>

💎같은걸 비교할 때에는 == 다른걸 비교할 때에는 !=&#x20;

💎==는 느슨한 비교  ===는 엄격한 비교&#x20;

&#x20;   느슨한 비교는 자료형이 달라도 형변환 뒤에 같으면 같다고 해준다.

| true로 인식하는 자료 | false로 인식하는 자료 |
| ------------- | -------------- |
| 0 제외한 숫자      | 0              |
| '문자'          | ' '            |
| \[ ]          | null           |
| { }           | undefined      |
|               | NaN            |

💎 동시 비교 && (and)

💎 || (or)

💎사칙 연산&#x20;

&#x20;   더하기 : +&#x20;

&#x20;   뺴기   : -&#x20;

&#x20;  곱하기 : \*

&#x20;  나누기 : /

&#x20;  나머지 : %

&#x20;이런거는 외워바야 소용없다 코드를 짜봐야 체득된다.

문제를 풀어보자.

🐱‍🚀 문제. 주사위 게임 2&#x20;

{% embed url="<https://school.programmers.co.kr/learn/challenges/training?order=acceptance_desc&page=1&languages=javascript&search=%EC%A3%BC%EC%82%AC%EC%9C%84>" %}

##

<figure><img src="https://3814826491-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJyHOwztPxBT3bLpisjCt%2Fuploads%2F2jwXyzNpgu9CDrbKQ0o4%2Fimages.jpg?alt=media&#x26;token=104a12ac-9221-4613-896c-895906964d85" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3814826491-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJyHOwztPxBT3bLpisjCt%2Fuploads%2F4sR1VjPvNYIr7d2mggme%2FScreenshot_8.png?alt=media&#x26;token=ec255d5f-769b-466f-aea9-e452aea7f103" alt=""><figcaption></figcaption></figure>

&#x20;맞고 틀린 게 중요한 게 아니라 배운걸 얼마나 실제 코드에 적용할 수 있냐가 중요하다.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://leeans-dev-book.gitbook.io/docs/lecture/javascript/input-change-and-or.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
