웹개발/JavaScript
-
JavaScript 개념 정리웹개발/JavaScript 2024. 9. 11. 09:49
자바스크립트(JavaScript)는 동적인 웹 페이지를 작성하기 위해 사용되는 언어입니다.모든 웹브라우저에서 지원하며, 웹 페이지를 보다 상호작용적으로 만들 수 있게 해줍니다. HTML이나 CSS와 달리, 자바스크립트는 웹 페이지에서 동적으로 콘텐츠를 업데이트하거나 사용자 이벤트에 반응할 수 있습니다. 동적 웹 페이지 작성 언어: 자바스크립트는 사용자가 웹 페이지와 상호작용할 수 있도록 해줍니다.브라우저 호환성: 대부분의 웹 브라우저는 자바스크립트를 기본적으로 지원합니다.자바스크립트의 주요 특징들을 알려줘 인터프리터 언어: 코드를 한 줄씩 해석하여 실행하는 방식의 언어입니다.동적 타이핑(Dynamic Typing): 변수의 타입이 고정되지 않고, 실행 시점에 결정됩니다.객체 기반 언어: 객체를 중심으로 ..
-
🔢 자바스크립트 Math 객체 완벽 가이드 - 필수 메서드 총정리!웹개발/JavaScript 2024. 7. 27. 18:17
자바스크립트의 Math 내장 객체안녕하세요, 친구들! 오늘은 자바스크립트의 강력한 내장 객체 중 하나인 Math 객체에 대해 알아볼 거예요. 숫자와 관련된 다양한 작업을 쉽게 할 수 있게 도와주는 이 객체를 통해 코딩을 더욱 재미있게 만들어봐요! 🚀1. Math.min(val1, val2, val3, val4)Math.min 메서드는 주어진 숫자 중 가장 작은 값을 반환해요.let result = Math.min(10, -10, 20, 50, -30);console.log(result); // -30 2. Math.max()Math.max 메서드는 주어진 숫자 중 가장 큰 값을 반환해요.let result = Math.max(10, -10, 20, 50, -30);console.log(result); ..
-
자바스크립트 문자열 객체 완벽 가이드웹개발/JavaScript 2024. 7. 27. 18:11
자바스크립트의 문자열 객체안녕하세요:)오늘은 자바스크립트에서 자주 사용하는 **문자열 객체(String)**에 대해 배워볼 거예요. 문자열 객체는 텍스트 데이터를 쉽게 다루고 조작할 수 있게 해주는 다양한 메서드를 제공해요. 함께 알아볼까요? 🚀 .split([separator[,limit]])split 메서드는 문자열을 지정한 구분자(separator)로 나눠서 배열로 반환해요.let url = 'https://www.naver.com';let splitArr = url.split("://");console.log(splitArr); // ['https', 'www.naver.com'] .charAt(index)charAt 메서드는 지정한 인덱스에 해당하는 문자를 반환해요.let url = 'http..
-
자바스크립트 배열 객체 완벽 가이드웹개발/JavaScript 2024. 7. 27. 17:53
자바스크립트의 배열 객체안녕하세요, 친구들! 오늘은 자바스크립트에서 자주 사용하는 **배열 객체(Array)**에 대해 배워볼 거예요. 배열 객체는 데이터를 쉽게 다루고 조작할 수 있게 해주는 다양한 메서드를 제공해요. 함께 알아볼까요? 🚀배열 객체 생성배열 객체를 생성하는 방법은 아주 간단해요. 예를 들어볼까요?let arr = [10,20,30];이렇게 하면 숫자 10, 20, 30이 들어있는 배열이 생성돼요. .push()push 메서드는 배열의 끝에 새로운 요소를 추가해요.let arr = [10, 20, 30];arr.push(40);console.log(arr); // [10, 20, 30, 40] .shift()shift 메서드는 배열의 첫 번째 요소를 제거하고, 제거된 요소를 반환해요.l..
-
자바스크립트 개발자라면 꼭 알아야 할 표준 내장 객체!웹개발/JavaScript 2024. 7. 27. 17:25
자바스크립트의 표준 내장 객체란?안녕, 친구들! 오늘은 자바스크립트에서 꼭 알아야 할 표준 내장 객체에 대해 얘기해볼 거야. 이 객체들은 자바스크립트 엔진에 기본적으로 내장되어 있어서 언제 어디서나 사용할 수 있어! 😎표준 내장 객체란?표준 내장 객체는 자바스크립트 엔진에 항상 존재하는 객체들이야. 덕분에 우리가 코드를 작성할 때 정말 유용하게 쓸 수 있어. 대표적인 표준 내장 객체에는 다음과 같은 것들이 있어:ObjectFunctionArrayStringBooleanNumberMathDateRegExp 이 모든 걸 한 번에 기억하는 건 어려워. 그래서 필요할 때마다 문서를 참고하면 돼! 📚https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference..
-
자바스크립트 이벤트 모르면 나가라.웹개발/JavaScript 2024. 7. 20. 17:58
오늘은 웹 페이지에서 일어나는 여러 가지 이벤트에 대해 얘기해볼게.자바스크립트로 페이지를 더 인터랙티브(interactive)하게 만들려면 이벤트를 잘 이해하고 활용하는 게 중요해.이벤트란?**이벤트(event)**란 브라우저에서 발생하는 상호작용을 말해. 예를 들어 사용자가 마우스를 클릭했을 때, 더블 클릭했을 때, 키보드 버튼을 눌렀을 때, 스크롤을 했을 때 등등이 있어. 이런 상호작용이 발생하면 자바스크립트에서는 이벤트가 발생했다고 표현해. 이벤트는 크게 세 가지로 구분할 수 있어:이벤트 타겟(event target),이벤트 타입(event type),이벤트 핸들러(event handler).이벤트 타겟이벤트 타겟은 이벤트가 일어난 문서 객체를 의미해.예를 들어, 버튼을 클릭했다면 그 버튼이 이벤트..
-
DOM(Documents Object Model)이 뭐야!?@!??웹개발/JavaScript 2024. 7. 20. 17:33
안녕! 반가워, 나는 평범한 컴공 대학생이야.오늘은 웹 개발의 기초 중 하나인 DOM에 대해 알려줄게. 혹시 웹 페이지를 꾸밀 때 HTML과 CSS만 써봤다면, 이제는 자바스크립트를 통해 페이지를 동적으로 제어하는 방법도 알아두면 좋아!이를 위한게 바로 Documents Object Model => DOM이야!DOM이 뭐야?**DOM(Documents Object Model)**은 웹 페이지를 자바스크립트로 제어하기 위한 모델이야. 웹 브라우저에 표시되는 HTML 태그들을 자바스크립트가 이해할 수 있게 객체로 변환한 거라고 생각하면 돼. 이를 통해 자바스크립트가 웹 페이지의 요소들을 선택하고, 수정하고, 삭제할 수 있는 거지.다시 말해서, 웹 브라우저가 HTML 문서를 파싱해서 객체 형태로 변환한 결과물..
-
자바스크립트의 함수 선언 및 표현 방법을 알려줄게!웹개발/JavaScript 2024. 7. 18. 10:30
오늘은 함수에 대해 알아보자. 함수는 프로그램에서 아주 중요한 개념이야.쉽게 말해, 함수는 하나의 특별한 목적을 가지고 코드를 실행하도록 만드는 문법이야.다양한 방법으로 함수를 정의하고 사용할 수 있어. 그럼, 하나씩 살펴볼까?함수 선언식과 함수 표현식자바스크립트에서는 함수를 두 가지 방법으로 정의할 수 있어: 1. 함수 선언식과 2. 함수 표현식.그리고 두 가지 방법을 알게 되면 3. 화살표 함수도 사용할 수 있게 될거야!1. 함수 선언식 (Function Declaration)함수 선언식은 함수를 미리 선언하는 방식이야. 이렇게 하면, 함수가 정의되기 전에 호출할 수 있어.function sayHello() { console.log("Hello!");}sayHello(); // "Hello!" 출력..