카테고리 없음

스테이지어스 4주차 정리(1)

jjon-jonny 2024. 4. 9. 17:32

javascript

 

1. 함수

function f() 

 

2. 변수

var abc

 

3. js에서 html 값 가져오기

var value=document.getElementid("abc")

value.style.backgroundcolor

value.textXontent="~~" 이런식 등등

 

4. js에서 html 값 수정하기

3번과 동일

 

5. 조건문

if()

 

6. 반복문

for 문 while 문

 

7. js에서 html tag 만들기

 var tmptag = document.createElement("p")

 

 

8. 리스트

배열 vs 리스트

어레이 리스트와 링크드리스트 묻는거

 

근데 js에서는 배열이 존재하지 않음...

 

9. 이벤트 심화

 

이벤트 종류

ㄴ 브라우저에는 사용자가 할 수 있는 행동의 갯수만큼 이벤트 종류가 존재함

 

onclick- 클릭한다

onchange- 값을 바꾼다

onscroll- 스크롤 한다

onmouseover- 마우스를 올린다

onmouseleave- 마우스를 내린다 

등등...

 

추가로 공부 해보면 좋은 부분

 

1. onmouseover vs onmouseseenter 의 차이

onmouseover 는 직접 이벤트를 걸지 않은 자식요소에다가 올려놔도 적용이 되는데

onmouseseenter 는 그렇지 않다 본인만 적용이 됨!

 

2. onclick vs ontouch 의 차이

onclick 은 오로지 클릭했을 때만

ontouch는 클릭, 드래그, 클릭을 땠을때 모두!

 

3. onchange vs oninput 의 차이

oninput 은 input 값이 변경될때 바로 이벤트 발생

onchange 는 포커스가 풀리고 나서 이벤트 발생됨

 

 

 

Drag & Drop 이벤트

ㄴ 다른 이벤트들과 조금 다르다.

ㄴ 드래그 이벤트, 드래그 오버 이벤트, 드랍 이벤트 등등...

ㄴ 다른 이벤트는 어떤 행위를 했을 때, 결과가 바로 나오지만 Drag & Drop 이벤트는 여러 이벤트가 조합되어서

최종 결과가 나온다!!

 

 

==  컨벤션  ==

 

==> 정의

ㄴ 쉽게 말해서 코드를 쓰는 규칙을 의미

 

- 구성

ㄴ 이름을 짓는 것, 함수를 쪼개는 것, 파일을 나누는 것

 

이름을 짓는 방식

 

1. 작성 방식

 

1) 변수나 함수 이름 지을때

1] camel(낙타)

loginButton

 

2]snake

login_button

 

2) 파일명, 객체명

paskal: LoginButton

 

스테이지어스는 프로그래밍 이름은 camel 비프로그래밍 이름 snake로

 

2. 구성

ㄴ 임의로 단어 줄여서 쓰지 말 것

ㄴ 통일된 단어를 써야 함

ㄴ 개발자가 많이 사용하는 단어를 써야 함(영어사전 봐야한다면 잘못 지은 것)

ㄴ 변수는 명사의 조합/ 함수는 동사 + 명사의 조합

ex)

loginbutton

videocontainer

 

setcolor

clickbutton

calgugudan 등등..