JavaScript 종합 버전, 1/2페이지_javascript 기술
프로그래밍 세계에는 두 가지 기본 요소만 있습니다. 하나는 데이터이고 다른 하나는 코드입니다. 프로그래밍의 세계는 데이터와 코드의 뗄 수 없는 얽힘 속에서 무한한 생명력과 생명력을 보여줍니다.
데이터는 천성적으로 조용하고 항상 고유한 특성을 유지하고 싶어하지만 코드는 천성적으로 활기차고 항상 세상을 바꾸고 싶어합니다.
아시다시피 데이터 코드의 관계는 놀랍게도 물질과 에너지의 관계와 유사합니다. 데이터에도 관성이 있습니다. 외력을 가하는 코드가 없으면 항상 원래 상태를 유지합니다. 코드는 에너지와 같습니다. 코드의 유일한 존재 목적은 데이터의 원래 상태를 변경하기 위해 열심히 노력하는 것입니다. 코드가 데이터를 변경하면 데이터의 저항으로 인해 코드의 원래 추세에도 영향을 미치거나 변경됩니다. 어떤 경우에도 데이터는 코드로 변환될 수 있고, 코드는 데이터로 변환될 수 있으며, E=MC2와 유사한 디지털 변환 방정식이 있을 수 있습니다. 그러나 컴퓨터 세계의 법칙이 항상 반영될 수 있는 것은 데이터와 코드 사이의 모순적이면서도 통일된 작동입니다. 이러한 법칙이 바로 우리가 작성하는 프로그램 논리입니다.
하지만 프로그래머마다 세계관이 다르기 때문에 이러한 데이터와 코드도 다르게 보입니다. 결과적으로, 서로 다른 세계관을 가진 프로그래머들은 자신만의 방법론을 사용하여 프로그래밍 세계의 진화와 발전을 촉진합니다.
우리 모두 알고 있듯이 오늘날 가장 인기 있는 프로그래밍 아이디어는 객체 지향 프로그래밍입니다. 객체 지향 아이디어가 프로그래밍 세계에서 빠르게 인기를 얻을 수 있는 이유는 무엇입니까? 객체지향 사고는 최초로 데이터와 코드를 하나로 묶어 프로그래머에게 단순한 객체 개념으로 제시하기 때문이다. 이는 원래의 지저분한 알고리즘과 서브루틴, 그리고 얽혀 있던 복잡한 데이터 구조를 갑자기 명확하고 질서정연한 객체 구조로 나누어 우리 마음속의 지저분한 데이터와 코드의 매듭을 명료하게 만듭니다. 우리는 또 다른 사고 수준에서 더 명확한 마음을 갖고 더 넓은 프로그래밍 세계를 탐험할 수 있습니다.
어느 날, 오조 홍인께서 '대상진경'을 설하신 후 모든 제자들에게 이렇게 말씀하셨습니다. 읽다. ". 장수 신수(沈秀)는 가장 높은 이해력을 지닌 형으로 인정받는다. 그의 시는 다음과 같다. 먼지가 쌓여!". 이 구절이 나오자마자 형제들 사이에서 모두가 이 구절이 너무 잘 쓰여졌다고 말했습니다. 불머리 승려 혜만이 그것을 보고 조용히 한숨을 쉬며 벽에 이렇게 썼습니다. "물체에는 뿌리가 없고 글자도 보이지 않습니다. 애초에 아무것도 없는데 어디에 먼지가 생길 수 있습니까?" 그러다가 그는 고개를 저으며 걸어갔다. 혜능 게타를 읽은 사람들은 모두 “너무 엉망으로 쓰여 있어서 이해할 수 없다”고 말했다. 홍인 선사는 신수의 시를 읽고 고개를 끄덕이며 찬탄한 다음, 혜능의 시를 보고 조용히 고개를 저었습니다. 그날 밤, 홍인은 조용히 혜능을 자신의 명상실로 불러 그가 오랫동안 소중히 간직해 온 소프트웨어 경전을 가르친 뒤 달빛 아래서 하룻밤을 보내달라고 부탁했는데...
나중에 혜능은 정말 그렇지 않았다. t 스승님의 높은 기대에 부응하여 그는 남쪽에 선불교를 위한 또 하나의 광활한 하늘을 창조했습니다. Huineng이 가져간 소프트웨어 경전 중 하나는 "JavaScript Bible"이었습니다!
단순함으로 돌아가기
자바스크립트를 이해하려면 먼저 객체와 클래스의 개념을 버리고 데이터와 코드의 근원으로 돌아가야 합니다. 앞서 언급했듯이 프로그래밍 세계에는 데이터와 코드라는 두 가지 기본 요소만 있으며 이 두 요소는 서로 얽혀 있습니다. JavaScript는 데이터와 코드를 가장 원시적인 수준으로 단순화합니다.
JavaScript의 데이터는 매우 간단합니다. 단순 데이터에는 정의되지 않음, null, 부울, 숫자, 문자열의 다섯 가지 유형만 있고, 복합 데이터에는 객체라는 한 가지 유형만 있습니다. 이는 세상의 가장 기본적인 원소를 금속, 나무, 물, 불, 흙으로 분류하고, 기타 복합물질은 이 다섯 가지 기본원소로 구성되어 있다는 중국의 단순유물론과 같다.
JavaScript의 코드는 함수라는 한 가지 형태로만 반영됩니다.
참고: 위 단어는 모두 소문자이므로 Number, String, Object, Function 등 JavaScript 내장 함수와 혼동하지 마세요. 아시다시피 JavaScript 언어는 대소문자를 구분합니다!
모든 JavaScript 식별자, 상수, 변수 및 매개변수는 정의되지 않은 null, bool, 숫자, 문자열, 객체 및 함수 유형 중 하나일 뿐입니다. typeof의 반환 값으로 표시되는 유형입니다. 이 외에 다른 유형은 없습니다.
먼저 단순 데이터 유형에 대해 이야기해 보겠습니다.
정의되지 않음: 알려지지 않은 모든 것, 아무것도 아닌 것, 상상할 수 없는 것을 나타내며 코드가 이를 처리할 수 없습니다.
참고: Typeof(정의되지 않음) 반환도 정의되지 않습니다.
어떤 변수나 속성에든 정의되지 않음을 할당할 수 있지만 이는 변수가 지워진다는 의미는 아니며 추가 속성이 추가된다는 의미입니다.
null: 개념은 있지만 아무것도 없습니다. 무 속에 유가 있는 듯하고 유 속에 무도 있는 듯하다. 상상하기 어렵지만 이미 코드로 처리할 수 있습니다.
참고: Typeof(Null)는 Object를 반환하지만 NULL은 Object가 아니며, NULL 값을 가진 변수는 Object가 아닙니다.
부울: 예, 아니오, 의심의 여지가 없습니다. 옳은 것은 옳고, 그른 것은 그르다. 절대적으로 분명하다. 코드로 처리할 수 있고 코드의 흐름을 제어할 수도 있습니다.
수: 선형적인 것, 크기와 순서가 명확하고 수가 많지만 혼란스럽지 않습니다. 이는 코드의 일괄 처리를 용이하게 하고 코드의 반복 및 반복을 제어합니다.
참고: Typeof(nan) 및 Typeof(Infinity)는 모두 숫자를 반환합니다.
모든 수치 계산에 참여하는 NaN의 구조는 NaN이며, NaN != NaN입니다.
무한대 / 무한대 = NaN.
문자열: 기계 신호가 아닌 인간을 위한 합리적인 것입니다. 인간-컴퓨터 정보 통신, 인간 의도에 대한 코드 이해 등이 모두 여기에 의존합니다.
단순 유형은 객체가 아니며 JavaScript는 이러한 단순 유형에 객체화 기능을 제공하지 않습니다. 단순형의 상수값이 직접 할당된 식별자, 변수, 매개변수는 객체가 아닙니다.
소위 "객관화"란 데이터와 코드를 복잡한 구조로 구성하는 능력입니다. JavaScript에서는 객체 유형과 함수 유형만 객체화 기능을 제공합니다.
수업 없음
Object는 Object의 종류입니다. JavaScript에서는 데이터와 코드가 아무리 복잡하더라도 객체 형태로 객체로 정리할 수 있습니다.
하지만 JavaScript에는 "클래스"라는 개념이 없습니다!
많은 객체 지향 프로그래머에게 이것은 아마도 JavaScript에서 가장 이해하기 어려운 것일 것입니다. 네, 거의 모든 객체지향 책에서 가장 먼저 이야기하는 것은 객체지향의 기둥인 '클래스' 개념입니다. 갑자기 "범주"가 사라지고, 우리는 영적 지원을 잃은 것처럼 느끼고 주인이 없다고 느낍니다. 객체와 클래스를 버리고 "객체에 뿌리가 없고 유형도 보이지 않는" 상태에 도달하는 것은 쉽지 않은 것 같습니다.
먼저 JavaScript 프로그램을 살펴보겠습니다.
[모두 선택하려면 Ctrl A 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다. ]
이 JavaScript 프로그램은 처음에 생명 개체인 life를 생성했습니다. 생명이 탄생했을 때는 아무런 속성이나 메서드도 없는 단순한 개체였습니다. 첫 번째 생명 과정에서는 "계란 세포"처럼 보이는 body 속성과 say 메서드를 갖습니다. 두 번째 생애 동안에는 "꼬리"와 "아가미"가 자랐으며, 꼬리와 아가미 특성을 보아 분명히 "올챙이"였습니다. 세 번째 생애에는 꼬리와 아가미 속성이 사라졌으나 '네 다리'와 '폐'가 자라나 다리와 폐 속성을 획득해 마침내 '개구리'가 됐다. 상상력이 풍부하다면, 그것을 잘생긴 '왕자'로 만들어 아름다운 '공주'와 결혼할 수도 있을지도 모른다. 하지만 이 프로그램을 읽은 후 다음 질문에 대해 생각해 보세요.
꼭 수업이 필요한가요?
어렸을 때 들었던 '엄마를 찾는 꼬마 올챙이' 동화를 아직도 기억하시나요? 아마도 어젯밤에 여러분의 아이는 우연히 이 아름다운 동화 속에서 잠이 들었을 것입니다. 귀엽고 작은 올챙이는 자신의 유형이 계속해서 진화하는 과정에서 점차 어미와 같은 '종류'가 되어 어미를 찾았습니다. 이 동화에 담긴 프로그래밍 철학은 사물의 '클래스'가 처음부터 생겨나고, 계속해서 진화하고, 결국 사라지게 된다는 것입니다.
'클래스'는 실제로 우리가 복잡한 현실 세계를 이해하는 데 도움이 될 수 있습니다 , 이 혼란스러운 현실 세계는 분류될 필요가 있습니다. 하지만 우리의 생각이 '범주'에 얽매이면 '범주'는 '피곤'해집니다. 살아있는 물체에 처음부터 고정된 "클래스"가 할당되어도 여전히 진화할 수 있다고 상상해 보세요. 올챙이가 개구리로 변할 수 있나요? 아이들에게 엄마를 찾는 올챙이의 이야기도 들려줄 수 있나요?
따라서 JavaScript에는 "클래스"가 없습니다. 클래스는 보이지 않고 객체와 통합되었습니다. 자바스크립트 객체가 다른 프로그래밍 언어에는 없는 생명력을 갖게 된 것은 바로 '클래스'라는 개념을 버린 덕분이다.
이때 마음 속 깊은 곳에서 무엇인가를 느끼기 시작했다면 점차적으로 JavaScript의 Zen을 이해하기 시작한 것입니다.
함수의 마법
다음으로 JavaScript 함수의 마법에 대해 이야기해보겠습니다.
JavaScript 코드에는 함수라는 한 가지 형식만 있으며, 함수는 함수 유형입니다. 어쩌면 다른 프로그래밍 언어에는 프로시저나 메소드 같은 코드 개념이 있을 수도 있지만, 자바스크립트에는 함수의 형태가 한 가지뿐입니다. 함수를 작성할 때 함수 유형의 엔터티를 만듭니다. 다음 프로그램을 살펴보십시오.
[Ctrl A를 사용하여 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하기 전에 새로 고쳐야 합니다.]
실행 후 이 코드를 볼 수 있습니다. typeof(myfunc)가 반환하는 것은 함수입니다. 위의 함수 작성 방법을 "정의 수식"이라고 합니다. 다음 "변수 수식"으로 다시 작성하면 이해하기 더 쉽습니다.
[Ctrl A Full Optional note: 외부 Js를 도입해야 하는 경우 실행하기 전에 새로 고쳐야 합니다.]
여기에는 myfunc 변수가 명확하게 정의되어 있으며 해당 초기 값은 함수 엔터티에 할당됩니다. 따라서 typeof(myfunc)도 함수를 반환합니다. 실제로 이 두 함수의 작성 방법은 동일하며 몇 가지 사소한 차이점을 제외하면 내부 구현은 완전히 동일합니다. 즉, 우리가 작성하는 자바스크립트 함수는 그냥 변수라고 합니다. 변수 유형은 함수이고, 변수의 값은 우리가 작성한 함수 코드 본문입니다.
똑똑하다면 즉시 추가 질문을 할 수도 있습니다. 함수는 변수일 뿐이므로 변수에 값을 임의로 할당하고 어디에서나 사용할 수 있습니까?
다음 코드를 살펴보겠습니다.
[모두 선택하려면 Ctrl A 참고: 외부 J를 도입해야 하는 경우 새로 고쳐서 실행해야 합니다.]
이 프로그램을 실행한 결과는 다음과 같습니다. 대답은 '예'입니다! 함수가 처음 호출된 후 함수 변수에 새로운 함수 코드 본문이 할당되므로 함수가 두 번째 호출되면 다른 출력이 나타납니다.
좋습니다. 위의 코드를 첫 번째 정의된 함수 형식으로 변경해 보겠습니다.
[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 새로 고쳐야 합니다. 실행하다]
정확히 동일한 서명을 가진 두 함수가 다른 프로그래밍 언어에서는 불법이어야 한다는 점은 당연합니다. 하지만 JavaScript에서는 이것이 사실입니다. 그런데 프로그램을 실행한 후 이상한 현상이 발견되었습니다. 두 번의 호출은 마지막 함수에서 출력된 값일 뿐이었습니다! 분명히 첫 번째 함수는 아무 것도 하지 않습니다. 왜 이런가요?
JavaScript 실행 엔진은 프로그램을 한 줄씩 분석하고 실행하는 것이 아니라, 한 줄씩 분석하고 실행하는 것으로 나타났습니다. 또한, 동일한 프로그램을 분석하고 실행하는 동안 정의하는 함수문이 먼저 추출되어 실행됩니다. 함수 정의가 실행된 후 다른 명령문 코드가 순서대로 실행됩니다. 즉, myfunc이 처음 호출되기 전에 첫 번째 함수 문으로 정의된 코드 논리가 두 번째 함수 정의 문으로 덮어쓰여졌습니다. 따라서 두 호출 모두 마지막 함수 논리를 실행합니다.
예를 들어 이 JavaScript 코드를 두 부분으로 나눈 경우 HTML로 작성하고 태그를 사용하여 다음과 같이 두 부분으로 나눕니다.
[모두 선택하려면 Ctrl A 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.]
이때 출력은 순서대로 나오며, 또한 JavaScript가 실제로 하나씩 실행된다는 것을 증명합니다.
코드에 정의된 함수 명령문이 먼저 실행됩니다. 이는 정적 언어의 컴파일 개념과 약간 비슷해 보입니다. 따라서 일부 사람들은 이 기능을 JavaScript "사전 컴파일"이라고 부르기도 합니다.
대부분의 경우 이러한 세부 사항에 얽매일 필요는 없습니다. 한 가지만 기억하면 JavaScript의 코드도 일종의 데이터이며 임의로 할당하고 수정할 수 있으며 그 값은 코드의 논리입니다. 그러나 일반 데이터와는 달리 함수를 호출하고 실행할 수 있다.
하지만 JavaScript 함수가 이 시점에서만 좋다면 C의 함수 포인터, DELPHI의 메소드 포인터, C#의 대리자와 비교하면 얼마나 이상합니까! 그러나 JavaScript 함수의 마법은 다른 두 가지 측면에도 반영됩니다. 첫째, 함수 유형 자체도 객관화할 수 있는 능력이 있고, 둘째, 함수와 객체를 초월적으로 결합할 수 있는 능력이 있습니다.
Wonderful Objects
먼저 함수의 객체화 능력에 대해 이야기해 보겠습니다.
모든 함수는 해당 속성을 동적으로 추가하거나 제거할 수 있습니다. 이러한 속성은 단순 유형, 객체 또는 기타 함수일 수 있습니다. 즉, 함수는 객체의 특성을 모두 갖고 있어 함수를 객체처럼 사용할 수 있습니다. 실제로 함수는 객체이지만 일반 객체보다 대괄호 "()" 연산자가 하나 더 있습니다. 이 연산자는 함수의 논리를 실행하는 데 사용됩니다. 즉, 함수 자체는 계속 호출할 수 있지만 일반 객체는 완전히 동일하다는 점을 제외하면 호출할 수 없습니다. 아래 코드를 살펴보세요.
[모두 선택하려면 Ctrl A 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.]
이 코드에서는 Sing 함수를 정의한 후 Sing 함수에 작성자 및 시 속성을 동적으로 추가합니다. 작성자 및 시 속성을 다른 작성자 및 시로 설정하면 Sing()을 호출할 때 다른 결과가 표시됩니다. 이 예는 JavaScript 함수가 객체의 본질임을 이해하고 JavaScript 언어의 아름다움을 느낄 수 있도록 시적인 방법을 사용합니다.
위의 설명을 보면 함수 유형과 객체 유형이 동일하다는 점을 이해해야 합니다. 실제로 이러한 "객체"는 "속성"과 "메서드"를 모두 갖고 있기 때문에 이러한 방식으로 볼 수 있습니다. 그러나 다음 코드는 우리에게 새로운 의심을 줄 것입니다:
[Ctrl A를 사용하여 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다.]
예, 객체와 함수는 속성 이름이나 메서드 이름을 첨자로 사용하여 배열처럼 액세스하고 처리할 수 있습니다. 그렇다면 배열로 간주해야 할까요, 아니면 객체로 간주해야 할까요?
우리는 배열이 선형 데이터 구조로 간주되어야 한다는 것을 알고 있습니다. 선형 데이터 구조는 일반적으로 특정 규칙을 가지며 통합 배치 반복 작업에 적합합니다. 객체는 입자와 같이 분산되고 개인화된 사물을 설명하는 데 적합한 개별 데이터 구조입니다. 그러므로 우리는 다음과 같이 질문할 수도 있습니다. JavaScript의 객체는 파동인가 입자인가?
물체양자론이 있다면 답은 파동-입자 이중성임에 틀림없습니다!
따라서 JavaScript의 함수와 객체는 객체와 배열의 특성을 모두 갖습니다. 여기서 배열은 임의로 확장할 수 있는 이름-값 쌍의 모음인 "사전"이라고 합니다. 실제로 객체와 함수의 내부 구현은 사전 구조인데, 이 사전 구조는 엄격하고 절묘한 구문을 통해 풍부한 모습을 보여줍니다. 양자역학이 어떤 곳의 문제를 설명하고 처리하기 위해 입자를 사용하는 것처럼, 다른 곳의 문제를 설명하고 처리하기 위해 파동을 사용합니다. 필요할 때 문제를 설명하고 처리하기 위해 객체나 배열을 자유롭게 선택할 수도 있습니다. JavaScript의 이러한 놀라운 기능을 잘 이해하는 한 간결하고 강력한 코드를 많이 작성할 수 있습니다.
오브제를 내려놓다
기능과 오브제의 초월적인 결합을 살펴보자.
객체지향 프로그래밍의 세계에서는 데이터와 코드의 유기적인 결합이 객체의 개념을 구성합니다. 객체가 생성된 이후 프로그래밍 세계는 두 부분으로 나누어졌습니다. 하나는 객체 내부 세계이고 다른 하나는 객체 외부 세계입니다. 객체는 본질적으로 이기적이며 외부 세계는 허락 없이 객체 내부에 접근할 수 없습니다. 객체는 또한 외부 세계에 속성과 메서드를 제공하고 다른 사람에게 서비스를 제공하는 측면도 있습니다. 그러나 여기서 우리는 "대상에 대한 자기 인식"이라는 흥미로운 문제에 대해 이야기해야 합니다.
뭐? 그거 들었지? 주제가 자기 인식인가?
아마도 많은 프로그래머들이 이 사실을 처음 들어보게 될 것입니다. 하지만 C, C# 및 Java에서는 이것을 살펴보고 DELPHI에서는 self를, VB에서는 me를 살펴보세요. 아마도 갑자기 깨닫게 될 것입니다! 물론 "그 이상은 아니다"라고만 말할 수도 있다.
그러나 사물이 세계를 내부와 외부로 나눌 때 사물의 '자기'도 드러난다. "자기 인식"은 삶의 가장 기본적인 특성입니다! 프로그래밍 세계가 무한한 생명력과 생명력으로 가득 차 있는 것은 바로 객체의 강력한 생명력 때문입니다.
하지만 사물의 '자기 인식'은 우리에게 행복을 가져다줄 뿐만 아니라 고통과 고민을 안겨주기도 합니다. 우리는 사물에 너무 많은 욕망을 부여하며 항상 사물이 더 많은 일을 할 수 있기를 바랍니다. 그러나 객체의 이기심은 시스템 리소스를 놓고 서로 경쟁하게 만들고, 객체의 이기주의는 객체를 복잡하고 비대하게 만들고, 객체의 자기기만은 종종 지속적인 오류와 예외를 가져옵니다. 왜 우리는 그토록 많은 고통과 어려움을 겪고 있습니까?
그렇기 때문에 사물나무 아래에서 81일 동안 고민한 사람이 있었는데, 마침내 삶의 고통은 욕망에서 비롯되지만 욕망의 뿌리는 자기인식에서 나온다는 것을 깨달았다. . 그래서 그는 자신의 '자기'를 내려놓고 부처님이 되셨고, 그때부터 모든 중생을 제도하고 참된 경전을 전파하기 시작하셨습니다. 그의 이름은 석가모니이고, "자바스크립트 경"은 그가 설한 경전 중 하나입니다.
자바스크립트에도 이런 게 있는데 C나 C#, 자바 같은 언어에서는 이게 다릅니다. 일반 프로그래밍 언어에서는 객체 자체이지만 JavaScript에서는 반드시 그런 것은 아닙니다! 이것은 나일 수도 있고, 당신일 수도 있고, 그 사람일 수도 있습니다. 어쨌든 당신은 내 안에 있고 나는 당신 안에 있습니다. 따라서 JavaScript에서 이 의미를 이해하기 위해 원래의 "자기"를 사용할 수는 없습니다. 그러기 위해서는 먼저 원본 대상의 '자아'를 놓아야 합니다.
다음 코드를 살펴보겠습니다.
[모두 선택하려면 Ctrl A 참고: 외부 J를 도입해야 하는 경우 새로 고쳐서 실행해야 합니다.]
위 코드에서 볼 수 있듯이 동일한 함수를 다른 각도에서 호출할 수 있으며, 이것이 반드시 함수 자체가 속한 객체는 아닙니다. 이것은 어떤 객체를 함수 요소와 결합할 때의 개념일 뿐입니다. 이 조합은 일반적인 객체 언어의 기본 조합보다 더 유연하고 더 분리되고 자유롭게 나타납니다.
JavaScript 함수에서는 this를 현재 제공되는 "this" 개체로만 간주할 수 있습니다. 이것은 특별한 내장 매개변수입니다. 이 매개변수에 따라 "이" 개체의 속성과 메서드에 액세스할 수 있지만 이 매개변수에 값을 할당할 수는 없습니다. 일반 객체 언어에서는 메소드 본문 코드에서 이것을 생략할 수 있으며, 기본적으로 멤버는 "self"가 먼저입니다. 하지만 자바스크립트는 "self"가 없기 때문에 "this" 객체에 접근할 때 this는 생략할 수 없습니다!
객체 스케치
우리는 많은 주제에 대해 이야기했지만 논의하지 않은 매우 기본적인 질문이 있습니다. 즉, 객체를 만드는 방법은 무엇입니까?
이전 예에서는 이미 객체 생성을 포함했습니다. 우리는 JavaScript Object Notation(약칭 JSON)이라는 형식을 사용하는데, 이는 중국어로 "JavaScript Object Notation"으로 번역됩니다.
JSON은 객체를 생성하는 매우 간단한 방법을 제공합니다. 예를 들어,
속성 없이 개체를 만듭니다.
var o = {}
개체를 만들고 속성과 초기 값을 설정합니다.
var person = {name: "Angel", age: 18, 결혼: false};
개체를 만들고 속성과 메서드를 설정합니다.
var Speaker = {text: "Hello World", say: function(){alert(this.text)}}; > 더 복잡한 개체 만들기, 다른 개체 중첩, 개체 배열 등:
var company =
{
이름: "Microsoft",
제품: "softwares",
회장 : {이름: "Bill Gates", 나이: 53세, 기혼: true},
직원: [{이름: "Angel", 나이: 26, 기혼: false}, {이름: "Hanson", 나이: 32 , Marred: true}],
readme: function() {document.write(this.name " product " this.product);}
}
JSON 형식은 중괄호 "{ }" ","로 묶인 항목 목록으로, 각 항목은 쉼표 ","로 구분되며, 항목은 콜론 ":"으로 구분된 속성 이름과 속성 값입니다. 이는 일반적인 사전 표현이며 JavaScript의 객체가 사전 구조임을 다시 한 번 보여줍니다. 아무리 복잡한 객체라도 JSON 코드로 생성하고 할당할 수 있습니다.
실제로 JSON은 XML보다 더 간결하고 공간을 절약하는 최고의 JavaScript 객체 형식입니다. 객체를 JSON 형태의 문자열로 활용하여 네트워크 간 정보를 자유롭게 전송하고 교환할 수 있습니다. 이 JSON 문자열을 JavaScript 개체로 변환해야 하는 경우 강력한 디지털 변환 엔진인 eval 함수만 사용하면 JavaScript 메모리 개체를 즉시 얻을 수 있습니다. 그녀가 AJAX 무대에서 눈부신 스타가 된 것은 바로 JSON의 소박하고 소박한 자연미 때문이다.
자바스크립트는 이처럼 복잡해 보이는 객체지향적인 것들을 극도로 간결한 형태로 표현하는 것이 특징입니다. 파트너의 화려하고 무거운 메이크업을 벗고, 파트너에게 맑은 눈매를 선사해보세요!
객체 생성
자, 객체를 생성하는 또 다른 방법에 대해 논의해 보겠습니다.
JSON 외에도 JavaScript에서는 함수와 결합된 new 연산자를 사용하여 객체를 생성할 수 있습니다. 예:
function MyFunc() {} //빈 함수 정의
var anObj = new MyFunc(); //객체를 생성하려면 new 연산자와 MyFun 함수를 사용하세요.
JavaScript에서 객체를 생성하는 이 방식은 정말 흥미롭습니다.
실제로 위 코드는 다음과 같은 형식으로 다시 작성할 수 있습니다.
function MyFunc(){};
var anObj = {}; //객체 생성
MyFunc. (anObj); //anObj 객체를 이 포인터로 사용하여 MyFunc 함수를 호출합니다.
JavaScript는 먼저 new 연산자를 사용하여 객체를 생성한 다음 이 객체를 이 매개변수로 사용하여 다음 함수를 호출합니다. 사실 이것이 자바스크립트가 내부적으로 하는 일이고, 어떤 함수라도 이렇게 호출할 수 있습니다! 그런데 "anObj = new MyFunc()"라는 형태를 보면 또 익숙한 그림이 보이는데, 이것이 C와 C#이 객체를 생성하는 방식이 아닐까요? 모든 길은 영산으로 통하고, 같은 목적지로 통한다는 것이 밝혀졌습니다!
이것을 보면 '왜 이 MyFunc를 생성자로 사용할 수 없지?'라고 생각할 수도 있습니다. 축하합니다. 정답을 맞췄습니다! 자바스크립트도 그렇게 생각해요! 아래 코드를 보세요.
코드 복사 코드는 다음과 같습니다.
1 함수 사람(이름) //매개변수가 있는 생성자
2 {
3 this.name = name; //이 객체의 속성에 매개변수 값을 할당합니다.
4 this.SayHello = function() {alert("안녕하세요, 저는 " this입니다. name) ;}; //이 개체에 대한 SayHello 메서드를 정의합니다.
5 };
6
7 function Employee(이름, 급여) //하위 생성자
8 {
9 Person.call(this, 이름)
10 this .salary = 급여; //이 급여 속성을 설정합니다.
11 this.ShowMeTheMoney = function() {alert(this.name " $" this.salary);} // ShowMeTheMoney 메소드를 추가합니다.
12 }; //Empolyee 생성자를 사용하여 SteveJobs 개체를 만듭니다.
16
17 BillGates.SayHello() //표시: 저는 Bill Gates입니다.
18 SteveJobs.SayHello (); //표시: 저는 Steve Jobs입니다
19 SteveJobs.ShowMeTheMoney(); //표시: Steve Jobs $1234
20
21 Alert(BillGates.constructor == Person); : true
22 경보( SteveJobs.constructor == Employee); //표시: true
23
24 경보(BillGates.SayHello == SteveJobs.SayHello); //표시: false
이 코드는 함수를 생성자로 사용할 수 있을 뿐만 아니라 매개변수를 사용할 수도 있고 개체에 멤버와 메서드를 추가할 수도 있음을 보여줍니다. 9행에서 Employee 생성자는 매개변수로 받은 this를 사용하여 Person 생성자를 호출합니다. 이는 기본 클래스 생성자를 호출하는 것과 동일합니다. 21행과 22행은 다음을 나타냅니다. BillGates는 Person에서 생성되고 SteveJobs는 Employee에서 생성됩니다. 객체의 내장 생성자 속성은 객체를 생성하는 데 사용되는 특정 함수도 지정합니다!
사실 함수를 "클래스"라고 생각한다면 원래 "클래스"의 특성을 갖고 있기 때문에 "클래스"인 것입니다. 그렇지 않나요? 그녀가 낳은 아들들은 모두 같은 특성을 가지고 있고 생성자도 클래스와 같은 이름을 가지고 있습니다!
현재 페이지 1/2 12다음 페이지 전문 읽기
핫 AI 도구
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Undress AI Tool
무료로 이미지를 벗다
Clothoff.io
AI 옷 제거제
Video Face Swap
완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
뜨거운 주제
7640
15
1391
52
90
11
71
19
32
150
pip를 완전히 제거하고 Python을 보다 효율적으로 사용하는 방법을 알아보세요.
Jan 16, 2024 am 09:01 AM
더 이상 pip가 필요하지 않나요? 와서 pip를 효과적으로 제거하는 방법을 알아보세요! 소개: pip는 Python 패키지를 쉽게 설치, 업그레이드 및 제거할 수 있는 Python의 패키지 관리 도구 중 하나입니다. 그러나 때로는 다른 패키지 관리 도구를 사용하고 싶거나 Python 환경을 완전히 지워야 하기 때문에 pip를 제거해야 할 수도 있습니다. 이 문서에서는 pip를 효율적으로 제거하는 방법을 설명하고 구체적인 코드 예제를 제공합니다. 1. pip 제거 방법 다음은 pip 제거의 두 가지 일반적인 방법을 소개합니다.
matplotlib의 컬러맵에 대해 자세히 알아보기
Jan 09, 2024 pm 03:51 PM
matplotlib 색상표에 대해 자세히 알아보려면 특정 코드 예제가 필요합니다. 1. 소개 matplotlib는 다양한 유형의 차트를 만드는 데 사용할 수 있는 풍부한 그리기 기능 및 도구 세트를 제공합니다. 컬러맵(colormap)은 차트의 색 구성표를 결정하는 matplotlib의 중요한 개념입니다. matplotlib 색상표에 대한 심층적인 연구는 matplotlib의 그리기 기능을 더 잘 익히고 그리기를 더 편리하게 만드는 데 도움이 될 것입니다.
Pygame 시작하기: 종합적인 설치 및 구성 튜토리얼
Feb 19, 2024 pm 10:10 PM
처음부터 Pygame 배우기: 전체 설치 및 구성 튜토리얼, 특정 코드 예제 필요 소개: Pygame은 Python 프로그래밍 언어를 사용하여 개발된 오픈 소스 게임 개발 라이브러리로, 개발자가 다양한 유형을 쉽게 만들 수 있도록 풍부한 기능과 도구를 제공합니다. 게임의. 이 기사는 처음부터 Pygame을 배우는 데 도움이 될 것이며, 완전한 설치 및 구성 튜토리얼과 빠른 시작을 위한 특정 코드 예제를 제공할 것입니다. 1부: Python 및 Pygame 설치 먼저 다음 사항을 확인하세요.
C 언어의 매력을 밝히다: 프로그래머의 잠재력을 발견하다
Feb 24, 2024 pm 11:21 PM
C 언어 학습의 매력: 프로그래머의 잠재력을 여는 것 지속적인 기술 발전으로 컴퓨터 프로그래밍은 많은 주목을 받는 분야가 되었습니다. 많은 프로그래밍 언어 중에서 C 언어는 항상 프로그래머들에게 사랑을 받아 왔습니다. C 언어의 단순성, 효율성 및 폭넓은 적용 덕분에 많은 사람들이 프로그래밍 분야에 입문하는 첫 번째 단계는 C 언어입니다. 이 기사에서는 C 언어 학습의 매력과 C 언어 학습을 통해 프로그래머의 잠재력을 발휘하는 방법에 대해 설명합니다. 우선, C 언어 학습의 매력은 단순함에 있습니다. C언어는 다른 프로그래밍 언어에 비해
워드에서 근수를 입력하는 방법을 함께 알아볼까요?
Mar 19, 2024 pm 08:52 PM
Word에서 텍스트 내용을 편집할 때 수식 기호를 입력해야 하는 경우가 있습니다. 어떤 사람들은 Word에서 근수를 입력하는 방법을 모르기 때문에 편집자에게 Word에서 근수를 입력하는 방법에 대한 튜토리얼을 친구들과 공유해달라고 요청했습니다. 그것이 내 친구들에게 도움이 되기를 바랍니다. 먼저 컴퓨터에서 Word 소프트웨어를 연 다음 편집하려는 파일을 열고 루트 기호를 삽입해야 하는 위치로 커서를 이동합니다. 아래 그림 예를 참조하세요. 2. [삽입]을 선택한 후, 기호에서 [수식]을 선택하세요. 아래 그림의 빨간색 원과 같이 3. 아래의 [새 수식 삽입]을 선택하세요. 아래 그림의 빨간색 원과 같이 4. [부수]를 선택한 후 해당 부수를 선택합니다. 아래 그림의 빨간색 원에 표시된 대로:
간단한 JavaScript 튜토리얼: HTTP 상태 코드를 얻는 방법
Jan 05, 2024 pm 06:08 PM
JavaScript 튜토리얼: HTTP 상태 코드를 얻는 방법, 특정 코드 예제가 필요합니다. 서문: 웹 개발에서는 서버와의 데이터 상호 작용이 종종 포함됩니다. 서버와 통신할 때 반환된 HTTP 상태 코드를 가져와서 작업의 성공 여부를 확인하고 다양한 상태 코드에 따라 해당 처리를 수행해야 하는 경우가 많습니다. 이 기사에서는 JavaScript를 사용하여 HTTP 상태 코드를 얻는 방법과 몇 가지 실용적인 코드 예제를 제공합니다. XMLHttpRequest 사용
Go 언어의 주요 기능을 처음부터 배우세요
Mar 27, 2024 pm 05:03 PM
제목: Go 언어의 주요 기능을 처음부터 배우세요. Go 언어는 간단하고 효율적인 프로그래밍 언어로 개발자들이 선호합니다. Go 언어에서 main 함수는 진입 함수이고, 모든 Go 프로그램은 프로그램의 진입점으로 main 함수를 포함해야 합니다. 이 글에서는 Go 언어의 주요 기능을 처음부터 배우는 방법을 소개하고 구체적인 코드 예제를 제공합니다. 1. 먼저 Go 언어 개발 환경을 설치해야 합니다. 공식 홈페이지(https://golang.org)에 접속하시면 됩니다.
pip 설치를 빠르게 배우고 처음부터 기술을 익히십시오.
Jan 16, 2024 am 10:30 AM
pip 설치를 처음부터 배우고 특정 코드 예제가 필요합니다. 개요: pip는 Python 패키지를 쉽게 설치, 업그레이드 및 관리할 수 있는 도구입니다. Python 개발자에게는 pip 사용 기술을 익히는 것이 매우 중요합니다. 이 기사에서는 처음부터 pip 설치 방법을 소개하고 독자가 pip 사용법을 빠르게 익히는 데 도움이 되는 몇 가지 실용적인 팁과 구체적인 코드 예제를 제공합니다. 1. pip 설치 pip를 사용하기 전에 먼저 pip를 설치해야 합니다. 씨
