본문 바로가기
정리/Web dev.

[web] javascript 총정리

by 멘멘 2023. 4. 2.

HTML에서 javascript 사용하기

 

  • <script> 태그 사용
<h1>JavaScript</h1>
<script>
  document.write(1+1);
</script>

<h1>html</h1>
1+1
  • event 실행
<input type="button" value="hi" onclick="alert('hi')">
<input type="text" onchange="alert('changed')">
<input type="text" onkeydown="alert('key down!')">
  • console 창에서 직접 입력하기

 

데이터타입

숫자 문자열
연산(산술연산자) 다양한 기능의 함수

 

조건문

<h1>Conditional statements</h1>

<script>
  document.write("1<br>");
  if(true){
    document.write("2<br>");
  } else {
    document.write("3<br>");
  }
  document.write("4<br>");
</script>

 

 

반복문

<h1>Loop</h1>
<ul>
<script>
    document.write('<li>1</li>');
    var i = 0;
    while(i < 3){
      document.write('<li>2</li>');
      document.write('<li>3</li>');
      i = i + 1;
    }
    document.write('<li>4</li>');
</script>

 

함수

 <script>
        function two(){
          document.write('<li>2-1</li>');
          document.write('<li>2-2</li>');
        }
        document.write('<li>1</li>');
        two();
        document.write('<li>3</li>');
        two();
</script>

조건문이나 반복문, 함수 등은 기본적으로 C언어 등과 원리가 비슷하다.

 

객체

순서없이 값을 저장하는 것.다음은 초기화 및 추가 예제 코드이다.

다음과 같이 객체에 소속된 변수를 프로퍼티라고 부른다.

 <script>
       var coworkers = {
       "programmer":"egoing",
       "designer":"leezche"
       }; 
       
       document.write("programmer :" +coworkers.programmer+"<br>");
       document.write("designer :" +coworkers.designer+"<br>");
       
       coworkers.bookkepper = "duru";
       cowokers["data scientist"] = "taeho";
</script>

다음과 같이 반복문으로 활용할 수 있다.

<script>
	for(car key in coworkers){
    	document.write(key+':'+coworkers[key]+'<br>');
    }
</script>

아래 예제와 같이 객체에 소속된 함수를 메소드라고 한다.

<script>
	coworkers.showAll = function(){
    	for(var key in this){
        	document.write(key+':'+this[key] +'<br>');
        }
    }
	coworkers.showAll();
</script>

 

라이브러리와 프레임워크

라이브러리(library)

재사용하기 쉽게 되어있는 소프트웨어

 

프레임워크(framework)

만들고자 하는 것에 따라 필요한 공통적인 부분이 만들어져 있는 것

 

UI / API

UI (user interface)

사용자가 시스템을 제어하기 위해서 사용하는 조작장치

 

API (application programming interface)

애플리케이션을 만들기 위해서 프로그래밍을 할 때 사용하는 조작장치

(ex) alert

'정리 > Web dev.' 카테고리의 다른 글

[web] php & mysql  (0) 2023.11.12
[web] Cookie / Session  (0) 2023.05.14
[web] 웹 기본 상식  (0) 2023.05.07
[web]php 간단 정리  (0) 2023.04.09
[web] html & internet  (0) 2023.03.26

댓글