[프로그래밍] JavaScript

[JavaScript] JavaScript ?

JHVan 2024. 5. 13. 14:51

JavaScript

이미지 슬라이드 효과, 팝업 효과 등의 기능을 포함한 동적인 웹사이트 제작 시 사용되는 프로그래밍 언어

 

변수

데이터를 담는 공간

변수 선언 및 데이터 저장

var variable;
variable = 1
// inline
var variable = 1;
  • 변수 선언: 데이터를 담을 공간을 생성하는 것
  • 변수 초기화: 생성된 변수에 데이터를 전달하는 것

변수 확인방법

var variable = "a";
console.log(variable);
  • 출력 내용은 개발자 도구 > Console 탭에서 확인

변수 명명 규칙

  • 숫자로 시작할 수 없음 (예: var 1str; 불가)
  • 변수명은 최대한 자세하게 작성 (예: var randomNumber;)
  • 의미가 명확한 이름 사용 (반례: var tmax;)

자바스크립트 사용법

<body>
    <script src="index.js"></script>
</body>
  • <script> 태그 안에 src의 속성값으로 js 파일을 입력 후 html 파일과 연동

자바스크립트 데이터 타입

  • String: 문자열 
  • Object: 객체
  • Number: 숫자
  • Boolean: 불리
  • Function: 함수
  • undefined: 정의되지 않음
  • Array: 배열
  • null: 널

함수

선언법

var func1 = function() {
    //func1 의 function
} 
function func2() {
    //func2 의 function
} 
func1(); //or func2();
  • 매개 변수: 인자로부터 전달받은 값이 들어가는 통로
  • 인자: 함수에게 전달하는 데이터
  • return: 함수 안에 데이터를 저장할 때 사용

배열: 비슷한 성격을 가지고 있는 데이터를 하나의 변수 안에서 관리

var alphabet = ["A", "B", "C"];

console.log(alphabet);
console.log(alphabet[0]); 

alphabet[0] = "A";
console.log(alphabet); // ["A", "B", "C"]

 

객체: 프로퍼티, 메서드, 데이터로 구성, 여러 종류의 데이터 타입 삽입 가능

var student = {
    name: "studie",
    age: 20,
    subjects: ["japanese", "english", "korean"],
    sum: function(num1, num2) { return num1 + num2; }
}

 

자바스크립트의 프로퍼티와 메서드

 

문자열 프로퍼티와 메서드

  • .length: 문자열 길이
  • .charAt(): 특정 위치 문자 추출
  • .split(): 문자열 분할

배열 프로퍼티와 메서드

  • .push(), .unshift(): 배열 요소 추가
  • .pop(), .shift(): 배열 요소 제거

수학 관련 메서드

  • Math.abs(): 절대값
  • Math.ceil(): 올림
  • Math.floor(): 내림
  • Math.random(): 임의의 숫자 생성

타입 변환 메서드

  • parseInt(): 문자열을 정수로 변환
  • parseFloat(): 문자열을 실수로 변환

'[프로그래밍] JavaScript' 카테고리의 다른 글

[JavaScript] DOM과 이벤트  (0) 2024.05.20
[JavaScript] 연산자  (0) 2024.05.13