ProtoType(프로토타입) 그게 뭐죠?
·
웹개발/JavaScript
오늘은 프로토타입에 대해 알아보자. 프로토타입은 자바스크립트에서 객체들이 서로 기능을 공유할 수 있게 해주는 중요한 개념이야. 잘 이해해보면, 프로그래밍이 훨씬 쉬워질 거야!생성자 함수와 프로토타입먼저, 우리는 생성자 함수를 이용해서 여러 개의 객체를 만들 수 있었지? 예를 들어볼게:)생성자 함수를 모른다면 내가 쓴 글을 한 번 읽어보는 것을 추천할게! -> 읽어보기function MakeAnimalObject() { this.animalName = "곰"; this.animalType = "고양이"; this.animalAge = 8; this.animalGender = "male"; this.lastVisit = "2023-08-11"; this.getLastMedical = functio..
생성자 함수란 무엇일까?
·
웹개발/JavaScript
오늘은 생성자 함수에 대해 이야기해볼 거야. 이름만 들으면 조금 어렵게 느껴질 수도 있지만, 사실은 아주 간단한 개념이야. 자, 시작해볼까?동물 병원 이야기먼저, 동물 병원을 예로 들어볼게. 동물 병원에서는 많은 동물들이 진료를 받지. 예를 들어, 강아지 '뽀삐'와 '무지', 그리고 고양이 '곰'이가 있다고 해보자. 이 동물들의 정보를 저장하려면 이렇게 작성할 수 있어.let animal1 = { animalName : "뽀삐", // 이름 animalType : "강아지", // 종 animalAge : 10, // 나이 animalGender : "male", // 성별 lastVisit: '2020-10-21', // 마지막 방문일 getLastMedical : ..
자바스크립트 자료형 쉽게 이해하기: 기본 자료형부터 참조 자료형까지
·
웹개발/JavaScript
자바스크립트에는 다양한 자료형이 있어. 크게 기본 자료형과 참조 자료형으로 나눌 수 있어. 이 글을 통해 각 자료형을 쉽게 이해할 수 있게 설명해줄게.1. 기본 자료형기본 자료형은 말 그대로 기본적인 데이터 형태를 말해. 여기에는 숫자, 문자열, 논리형, 특수자료형, 심볼이 포함돼. 1.1 숫자(Number)숫자는 우리가 생각하는 수의 값을 말해. 양수, 음수, 정수, 소수, 지수 등 모두 숫자형에 속해.예를 들어, const age = 25;처럼 숫자를 변수에 담아 사용할 수 있어. 1.2 문자열(String)문자열은 큰 따옴표("")나 작은 따옴표('')로 감싸진 값을 말해. 예를 들어, const name = "John";나 const greeting = 'Hello';처럼 사용할 수 있어.cons..
웹 브라우저 작동 방식: 친구야, 이거 알면 웹 개발이 쉬워져!
·
웹개발/JavaScript
안녕, 친구들! 오늘은 웹 브라우저가 어떻게 작동하는지에 대해 이야기해볼게. 너무 어려운 내용은 아니니까 편하게 들어줘!웹 브라우저는 어떻게 작동할까?웹 브라우저가 웹 페이지를 보여주기 위해 어떤 과정을 거치는지 알아보자. 아주 쉽게 설명할 테니까 걱정 마!HTML 파싱(Parsing)먼저, 웹 브라우저는 웹 페이지의 코드를 읽어야 해. 이걸 '파싱(parsing)'이라고 해. 브라우저가 HTML 파일을 받아서 읽기 시작하면, 이게 바로 HTML 파싱이야.HTML 파싱을 통해 브라우저는 웹 페이지의 구조를 이해하게 돼. 예를 들어, , , 같은 태그들을 인식하고, 각각의 위치와 역할을 파악하지.자바스크립트 파싱HTML을 다 읽으면 이제 자바스크립트(JS)를 읽을 차례야. 자바스크립트는 웹 페이지에 동적..
웹 브라우저의 역사 : 친구야, 이거 알면 재밌어!
·
웹개발/JavaScript
안녕, 친구들! 오늘은 우리 일상에서 없어서는 안 될 웹 브라우저의 역사를 한 번 살펴보자. 마치 옛날 얘기 듣듯이 편하게 읽어줘!1993년: 모자이크 브라우저의 등장먼저, 1993년에 모자이크 브라우저가 나왔어. 이게 최초의 UI 웹 브라우저였어. 웹의 아버지라고 불리는 팀 버너스 리가 만든 건 아니지만, 이 브라우저 덕분에 일반 사람들도 인터넷을 쉽게 사용할 수 있게 됐지. 그 당시엔 전자기기가 엄청 비싸서, 소수의 사람들만 쓸 수 있었거든.1994년: 넷스케이프 내비게이터의 탄생1994년엔 넷스케이프라는 회사가 생겼는데, 이 회사가 만든 웹 브라우저가 바로 넷스케이프 내비게이터야. 모자이크 브라우저를 개발한 팀이 모여서 만든 거라, 더 나은 기능을 추가했지.그 해 9월, 넷스케이프 운영진 중 한 명..
프론트엔드에 Node.js가 왜 필요해요?
·
웹개발/JavaScript
Node.js는 무엇일까요?오늘은 Node.js에 대해 알아볼 거예요.Node.js는 서버 측에서 JavaScript를 실행할 수 있게 해주는 아주 중요한 런타임 환경이에요.쉽게 말해서, 우리가 브라우저가 아닌 서버에서도 JavaScript를 쓸 수 있게 해준답니다.Node.js를 사용하면 자바스크립트로 서버를 만들고, 다양한 기능을 구현할 수 있어요.왜 Node.js를 설치해야 할까요?여러분이 프로젝트를 진행할 때, 사용하는 라이브러리들이 거의 대부분 Node.js를 기반으로 하고 있어요.그래서 Node.js를 설치하는 게 정말 중요해요.예를 들어, Express.js나 Sequelize 같은 라이브러리들이 Node.js 환경에서 동작하거든요.Node.js 버전 관리의 중요성이제 Node.js의 버전이..
JavaScript 반복문 응용하기
·
웹개발/JavaScript
JavaScript에서 배열과 객체를 효율적으로 다루기 위해 반복문을 사용하는 방법을 살펴보겠습니다. 인덱스를 이용한 순회let foods = ["apple", "banana", "cherry"];for (let i = 0; i length 속성을 사용해서 배열의 길이에 맞춰 반복문을 설정합니다. for...of 문for (let food of foods) { console.log(food);}배열을 순회할 때에는 for...of문을 사용하여 순회할 수 있습니다. 객체와 반복문Object.keyslet person = {name: "John", age: 30};for (let key of Object.keys(person)) { console.log(key, person[key]);}객체의 키..
컴공생이 알려주는 JavaScript 객체 자료형
·
웹개발/JavaScript
JavaScript에서 객체는 매우 중요한 개념입니다. 특히 배열과 함수가 객체로 취급되는 점과 참조 기반 저장의 의미를 이해하는 것이 중요합니다.객체의 정의와 특성객체는 속성과 메서드의 집합입니다. JavaScript에서 객체는 키, 값 쌍으로 구성되며, 이를 통해 데이터를 구조화할 수 있습니다. 객체는 중괄호 '{ }' 로 생성하며, 속성은 점 ' . ' 또는 대괄호 ' [ ] ' 표기법으로 접근할 수 있습니다.let person = { name: "John", age: 30};console.log(person.name); // John 배열과 함수도 객체배열은 특수한 객체로, 숫자 인덱스를 사용해 요소에 접근합니다. 배열은 다양한 메서드를 제공하여 데이터를 쉽게 조작할 수 있습니다.let..