📒[JavaScript] - JS

1. ✏️ JAVASCRIPT 쓰는 이유?

: 쉽게 말해 HTML을 조작할 수 있어서
(예쁜 UI만들기 가능)

그외엔 서버와 통신가능 / 클릭.타이핑 감지 / 비동기 처리 / 자료 다루기 등

예시)

---

1-1.✏️ 프로그램이란?

컴퓨터에게 일을 시키는 것과 같음

---

📌Tip

vscode 사용시 서버 Live Server 플러그인 설치 -> 바로 확인 가능

---

🔎 Alert 박스 만들기

---

📌 Note Code

• css
  display : none; ➡️ 알림창 숨기기
  display : block; ➡️ 알림창 보이기
  
  

• function 작명 () { } 함수를 이용해서 긴 코드를 축약해보자!

  why? 코드 지저분한거 깔끔하게 보이게 할 수 있고 & 코드 재사용 가능!!

• 위에서부터 코드를 읽기때문에
  내가 조작할 html밑에다 js코드를 짜놔야한다.

---

• ✅ 결과

  : 허접하지만 닫기와 버튼을 누를 때 알림창이 사라지고 보인다..!

그런데 위에 코드를 더 간단하게 리팩토링 해보자면,

파라미터 문법을 사용해서 비슷한 함수를 묶어서 한번에 쓸 수 있음

예시)

---

📌 Note Code

• 파라미터는 여러개 / 아무렇게나 가능
  function 작명(alert1, alert2){}도 가능하다는 소리

• 아래 예시에선 (message,action)으로 받았는데, 그 안에 내용은 똑같이 js문법그대로 getElementById 받고싶은거 받아서 그걸 message랑 action으로 받아주면 됨

이때 마지막 받을 땐 (message,action) 여기에 ''이거 안붙었으니까 ''이거 빼기!!!

---

이렇게 class가 많이 적용되어있을 땐 className으로 찾고 [i]몇번째인지 옆에 써주면 해당 내용이 변경된다!

여기서 tagName으로 찾는건 button같은걸 말한다!

🔎 addEventListener() 이거 쓰면 onclick 대체가능!

---

📌 Note Code

• 콜백함수 : 코드를 순차적으로 실행할 때 / 모듈화 / 코드 재사용 등의 특징때문에 쓴다!

---