728x90

Language 120

[Javascript] Pass By Value/Reference 및 의도치 않은 객체 변경 해결법

변수 넘겨주는 방법 Pass(Call) by reference : 참조에 의한 전달 object type을 객체 또는 참조 타입이라 한다. 참조 타입이란 객체의 모든 연산이 실제값이 아닌 참조값으로 처리됨을 의미한다. 원시 타입은 값이 한번 정해지면 변경할 수 없지만(immutable), 객체는 프로퍼티를 변경, 추가, 삭제가 가능하므로 변경 가능(mutable)한 값이라 할 수 있다. 따라서 객체 타입은 동적으로 변화할 수 있으므로 어느 정도의 메모리 공간을 확보해야 하는지 예측할 수 없기 때문에 런타임에 메모리 공간을 확보하고 메모리의 힙 영역(Heap Segment)에 저장된다. var foo = { val: 10 }; var bar = { val: 10 }; console.log(foo.val, ..

Language/Javascript 2023.07.30

[Javascript] 자바스크립트 웹 Request(요청)과 Response(응답)

URL(Uniform Resource Locator) 웹에 존재하는 수많은 데이터 중에서 원하는 데이터를 특정하기 위해 URL을 사용한다. URL은 크게 호스트(host) + 패스(path) + 쿼리(query)로 이루어져 있다. URL을 입력하고 엔터를 치면, 웹 브라우저는 URL에서 호스트(host) 부분을 보고, 전 세계의 수많은 서버들 중에서 정확히 어느 서버와 통신을 해야 하는지를 찾는다. 어떤 서버와 통신해야 하는지를 식별했다면 웹 브라우저는 해당 서버로 Request를 보낸다. 이때 URL에서 패쓰(path) 이후의 부분들을 리퀘스트에 담아서 보낸다. 리퀘스트를 받은 서버는 리퀘스트에 담긴 패쓰(path) 이후의 부분들을 보고, 그것이 의미하는 데이터를 찾은 결과를 Response에 담아서 ..

Language/Javascript 2023.07.23

[Javascript] 자바스크립트 예외 처리 - throw, try, strict

예외(exception)란? 예외란 프로그램이 실행 중에 발생하는 런타임 오류를 의미하며, 예외가 발생하지 않도록 미리 방지하는 것도 중요하지만 발생한 예외를 처리하는 방법 또한 매우 중요하다. 오류(error)란 프로그램 구문의 문법적인 오류를 의미한다. 예외 발생 예외를 발생시킨다는 것은 명시적으로 오류를 발생시킨다는 의미뿐만 아니라 예외 상황을 알린다는 의미도 있으며, 자바스크립트에서는 throw 키워드를 사용하여 예외를 발생시킬 수 있다. 표현식에는 예외 코드를 나타내는 숫자나 오류 메시지를 담고 있는 문자열, Error 객체 등이 올 수 있다. throw 표현식; 예외 처리(exception handling) 자바스크립트에서는 프로그램이 실행되는 도중 발생하는 예외를 처리하기 위해 try / c..

Language/Javascript 2023.07.19

[Javascript] 자바스크립트 상속 - 프로토 타입 생성자, 체인

상속(inheritance)이란? 상속이란 새로운 클래스에서 기존 클래스의 모든 속성과 메소드를 사용할 수 있는 것을 의미한다. C#이나 C++과 같은 클래스 기반(class-based)의 객체 지향 언어와는 달리 자바스크립트는 프로토타입 기반(prototype-based)의 객체 지향 언어다. 클래스 기반 객체지향 프로그래밍 언어는 객체 생성 이전에 클래스를 정의하고 이를 통해 객체(인스턴스)를 생성한다. 하지만 프로토타입 기반 객체지향 프로그래밍 언어는 클래스 없이도 객체를 생성할 수 있다. (ECMAScript 6에서 클래스가 추가되었다) 프로토타입 기반이기 때문에 상속의 개념이 클래스 기반의 객체 지향 언어와는 약간 다른데, 자바스크립트에서는 현재 존재하고 있는 객체를 프로토타입으로 사용하여 해당..

Language/Javascript 2023.07.19

[Javascript] 자바스크립트 객체 - 프로퍼티와 메소드

객체 프로퍼티(property) 모든 자바스크립트 객체는 Object 객체와 Object.prototype 객체의 모든 프로퍼티를 상속받는다. prototype 프로퍼티를 이용하면 현재 존재하는 프로토타입에 새로운 프로퍼티나 메소드를 손쉽게 추가할 수 있다. 객체 메소드(method) 모든 자바스크립트 객체는 Object 객체와 Object.prototype 객체의 모든 프로퍼티와 메소드를 상속받는다. hasOwnProperty() 메소드 hasOwnProperty() 메소드는 특정 프로퍼티가 해당 객체에 존재하는지를 검사한다. 해당 객체에서 직접 선언된 프로퍼티만을 검사하며, 같은 이름의 프로퍼티라도 상속받은 프로퍼티는 false 값을 반환한다. function Dog(color, name, age, ..

Language/Javascript 2023.07.19

[Javascript] 자바스크립트 객체 - 정의, 참조, 생성, 삭제, 순회, 비교

객체(object)란? 자바스크립트는 객체(object) 기반의 스크립트 언어이며, 원시 데이터 타입을 제외한 나머지 값들은 모두 객체이다. 자바스크립트 객체는 키(key)와 값(value)으로 구성된 프로퍼티(property)의 집합으로, 프로퍼티 값으로 함수를 포함한 자바스크립트에서 사용할 수 있는 모든 값을 사용할 수 있다. 이와 같이 객체는 데이터를 의미하는 프로퍼티(property)와 데이터를 참조하고 조작할 수 있는 동작을 의미하는 메소드(method)로 구성된 집합이다. 객체는 데이터(property)와 그 데이터에 관련되는 동작(method)을 모두 포함할 수 있기 때문에 데이터와 동작을 하나의 단위로 구조화할 수 있어 유용하다. 자바스크립트의 객체는 객체지향의 상속을 구현하기 위해 “프로..

Language/Javascript 2023.07.19

[Javascript] 자바스크립트 함수 - 다양한 함수 종류 및 전역함수들

6\naddNum(1, 2); // 인수로 1, 2을 전달하여 함수를 호출 -> NaN\naddNum(1); // 인수로 1을 전달하여 함수를 호출 -> NaN\naddNum(); // 인수로 아무것도 전달하지 않고 함수를 호출 -> NaN\n\n\n/* 전달되지 않은 값을 undefined 대신 따로 값을 설정해 산술 연산 수행하는 방법 */\nfunction addNum(x, y, z) {\n if(x === undefined) // 함수 호출시 x에 해당하는 인수가 전달되지 않은 경우\n x = 0; // 변수 x의 값을 undefined에서 0으로 변경\n if(y === undefined) // 함수 호출시 y에 해당하는 인수가 전달되지 않은 경우\n y = 0; // 변수 y의 값을 undef..

Language/Javascript 2023.07.19

[Javascript] 자바스크립트 함수 - 매개변수와 인수, this, 프로퍼티

6\naddNum(1, 2); // 인수로 1, 2을 전달하여 함수를 호출 -> NaN\naddNum(1); // 인수로 1을 전달하여 함수를 호출 -> NaN\naddNum(); // 인수로 아무것도 전달하지 않고 함수를 호출 -> NaN\n\n\n/* 전달되지 않은 값을 undefined 대신 따로 값을 설정해 산술 연산 수행하는 방법 */\nfunction addNum(x, y, z) {\n if(x === undefined) // 함수 호출시 x에 해당하는 인수가 전달되지 않은 경우\n x = 0; // 변수 x의 값을 undefined에서 0으로 변경\n if(y === undefined) // 함수 호출시 y에 해당하는 인수가 전달되지 않은 경우\n y = 0; // 변수 y의 값을 undef..

Language/Javascript 2023.06.20

[Javascript] 자바스크립트 배열 - 생성, 추가, 인덱싱

-1;\n}\n \nvar arr = [1, true, \"JavaScript\"]; // 배열 생성\ndocument.write(arr.constructor); // constructor 프로퍼티 값 출력\ndocument.write(arr.constructor.toString()); // constructor 값 문자열로 변환\ndocument.write(arr.constructor.toString().indexOf(\"Array\")); // 9\n// indexOf() 메소드는 인수로 전달받은 문자열을 해당 문자열에서 찾지 못하면 -1을 반환\ndocument.write(isArray(arr)) // true\n// 변수 arr가 배열이면 Array 부분 문자열을 언제나 포함하고 있으므로 결과는 ..

Language/Javascript 2023.06.20

[Javascript] 자바스크립트 제어문 - label, continue, break

\");\n }\n}\n\n/* 출력 결과 */\n3 * 1 = 3\n3 * 3 = 9\n3 * 5 = 15\n3 * 7 = 21\n3 * 9 = 27"}],["code",{"code":"1. break;\n2. break 라벨이름;"}],["code",{"code":"/* 배열에서 특정값을 가지고 있는 인덱스를 출력 */\nvar lectures = [\"html\", \"css\", \"자바스크립트\", \"php\"];\nvar topic = \"자바스크립트\";\n\nfor (var i = 0; i 3)\n break gugudan;\n document.write(i + \" * \" + j + \" = \" + (i*j) + \"\");\n }\n}"..

Language/Javascript 2023.06.20
728x90