본문 바로가기
Language/Javascript

Javascript - 자바스크립트 특징 완벽정리

by 아보_ 2023. 4. 4.
반응형
자바스크립트는 웹 개발에서 가장 널리 사용되는 프로그래밍 언어 중 하나로, 웹 브라우저에서 동작하는 스크립트 언어입니다. 이 글에서는 자바스크립트의 주요 특징과 장단점을 살펴보고, 이를 통해 자바스크립트를 더 효과적으로 사용하는 방법을 배워보겠습니다.

 

1.  동적 타이핑

자바스크립트는 동적 타입(dynamic typing) 언어입니다. 즉, 변수의 타입이 코드 실행 중에 결정되며, 필요에 따라 변경될 수 있습니다. 이를 통해 개발자가 변수 타입을 명시적으로 선언할 필요 없이 유연하게 코드를 작성할 수 있습니다. 하지만 이러한 유연성은 때로는 예상치 못한 오류를 발생시킬 수 있습니다.

 

예시:

 

let dynamicVar = "I'm a string!";
console.log(typeof dynamicVar); // "string"

dynamicVar = 42;
console.log(typeof dynamicVar); // "number"

 

2.  객체 기반 언어

자바스크립트는 객체 지향 프로그래밍(Object-Oriented Programming, OOP)을 지원하는 언어입니다. 객체는 속성과 메서드를 포함하는 개체로, 코드를 재사용하고 모듈화하는 데 사용됩니다. 자바스크립트에서 거의 모든 것은 객체입니다. 예를 들어, 함수도 객체이며, 배열과 날짜도 객체입니다.

 

예시:

const person = {
  name: "Alice",
  age: 30,
  greet: function () {
    console.log("Hello, my name is " + this.name);
  },
};

person.greet(); // "Hello, my name is Alice"

 

3.  프로토타입 기반 상속

자바스크립트는 클래스 기반 언어와 달리 프로토타입 기반 언어입니다. 이는 객체 간 상속을 프로토타입 체인을 통해 처리합니다. 프로토타입 체인은 객체의 프로토타입이 다른 객체를 참조하여 상속 관계를 형성하는 것입니다.

 

예시:

function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.greet = function () {
  console.log("Hello, my name is " + this.name);
};

const alice = new Person("Alice", 30);
alice.greet(); // "Hello, my name is Alice"

ECMAScript 2015(ES6)부터는 클래스 구문을 도입하여 프로토타입 기반 상속을 더욱 쉽게 사용할 수 있게 되었습니다. 그러나 이 클래스 구문은 여전히 프로토타입 체인을 사용합니다.

 

예시:

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }

  greet() {
    console.log("Hello, my name is " + this.name);
  }
}

const bob = new Person("Bob", 25);
bob.greet(); // "Hello, my name is Bob"

 

4.  이벤트 주도 프로그래밍

자바스크립트는 웹 페이지의 이벤트에 반응하는 스크립트를 작성하기 위한 언어로 시작되었습니다. 이벤트 주도 프로그래밍(Event-Driven Programming)은 이벤트(예: 클릭, 키보드 입력)에 따라 코드가 실행되는 방식입니다. 이를 통해 사용자와 상호작용하는 동적인 웹 페이지를 구현할 수 있습니다.

 

예시:

<button id="myButton">Click me!</button>
<script>
  const button = document.getElementById("myButton");
  button.addEventListener("click", function () {
    alert("Button clicked!");
  });
</script>

5.  비동기 처리

자바스크립트는 비동기 처리를 지원하여 웹 페이지의 성능을 향상시킬 수 있습니다. 이를 통해 긴 작업을 백그라운드에서 실행하고, 완료되면 결과를 반환할 수 있습니다. 이러한 비동기 처리는 콜백 함수, 프로미스(Promise), async/await 구문 등을 사용하여 구현할 수 있습니다.

 

예시:

function getData(callback) {
  setTimeout(function () {
    const data = "Sample data";
    callback(data);
  }, 1000);
}

getData(function (result) {
  console.log(result); // "Sample data"
});

 

정리

자바스크립트는 동적 타이핑, 객체 기반 언어, 프로토타입 기반 상속, 이벤트 주도 프로그래밍 및 비동기 처리와 같은 특징을 가진 프로그래밍 언어입니다. 이러한 특징을 이해하고 활용하면 웹 개발에 있어 효과적인 코드를 작성할 수 있습니다. 자바스크립트의 특징을 충분히 이해하고 응용하면, 웹 애플리케이션의 성능과 사용자 경험을 높일 수 있을 것입니다.
반응형