JavaScript 기본 사항 - 개체 및 속성
——————————————————————————————————————————
객체: JavaScript는 프로토타입 기반 언어이고 Class가 없으므로 함수는 클래스로 사용됩니다.
객체에 포함된 데이터는 두 가지 방법으로 액세스할 수 있습니다
속성 Object(속성)와 메서드(메서드)
Properties는 모두 특정 개체에 속하는 변수이고, 메서드는 특정 개체에 의해서만 전달될 수 있는 함수입니다.
객체는 일부 관련 속성과 메서드로 구성된 데이터 엔터티입니다. JavaScript에서 속성과 메서드는 "점" 구문을 사용하여 액세스됩니다.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
객체 지향 용어
객체: 순서가 지정되지 않은 속성 모음 , 각 속성은 기본 값, 개체 및 함수를 저장합니다.
클래스: 모든 개체는 클래스에 의해 정의됩니다. 클래스는 개체의 인터페이스(개발자가 액세스하는 속성 및 메서드)를 정의할 뿐만 아니라 개체의 내부 속성도 정의합니다. 작업(속성 및 메서드를 작동시키는 코드)
인스턴스: 프로그램이 클래스를 사용하여 객체를 생성할 때 생성된 객체를 클래스의 인스턴스라고 합니다. 각 인스턴스는 동일하게 동작하지만 인스턴스는 독립적인 데이터 세트를 처리합니다.
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
네 가지 기본 능력
캡슐화: 관련 정보를 입력합니다( 데이터나 메소드에 상관없이) 객체에 저장하는 능력
Aggregation: 객체를 다른 객체 내에 저장하는 능력
상속: 다른 클래스(또는 여러 클래스)에서 획득 클래스의 속성과 메서드에 액세스
다형성: 다양한 방법으로 실행될 수 있는 함수나 메서드를 작성하는 능력
—————————————— —— —————————————————————————————
내장 객체
-
데이터 캡슐화 object
- 일반 개체 메서드 지원
search
match
replace
-
split
속성: Object.prototype.constructor:객체의 프로토타입을 생성한 함수에 대한 참조를 반환합니다
- 메서드:
Object.prototype.isPrototypeOf():객체가 다른 객체의 프로토타입 체인에 존재하는지 감지합니다.
Object.prototype.propertyIsEnumerable():지정된 속성 이름이 The인지 여부를 감지합니다. 현재 객체의 열거 가능한 속성
Object.prototype.toString():객체를 나타내는 문자열을 반환합니다
Object.prototype.valueOf():returned Poem this 가치 , 이는 개체 자체입니다.
Object 개체는 Js에 있는 모든 개체의 상위 개체이며 우리가 만드는 모든 개체는 이
- 에서 상속됩니다. 방법:
Object.create():指定原型对象和属性创建一个对象
Object.defineProperty():给对象添加/修改一个属性并指定该属性的配置
Object.defineProperties():在一个对象上添加或修改一个或者多个自有属性,并返回该对象
Object.keys():方法会返回一个由给定对象的所有可枚举自身属性的属性名组成的数组,数组中属性名的排列顺序和使用for-in循环遍历该对象时返回的顺序一致(两者的主要区别是for-in还会遍历除一个对象从其原型链上继承到得可枚举的属性)
Object.getOwnPropertyNames():返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性)组成的数组
Object.getOwnPropertyDescriptor():返回指定对象上一个自有属性对应的属性描述符。(自有属性指的是直接赋予该对象的属性,不需要从原型链上进行查找的属性))
Object.getPrototypeOf():返回指定对象的原型(也就是该对象内部属性[[Prototype]]的值)
Object.freeze():冻结一个对象。冻结对象是指那些不能添加新的属性,不能修改已有属性的值,不能删除已有属性,以及不能修改已有属性的可枚举性、可配置性、可写性的对象。也就是说这个对象永远不能改变的
Object.isFrozen():判断对象是否已经被冻结
Object.preventExtensions():阻止对象扩展
Object.isExtensible():检测一个对象是否可扩展(是否可以在它上面添加新的属性)
Object.seal():可以让一个对象密封,并返回被密封之后的对象。密封对象是指那些不能添加新的属性、不能删除已有属性,以及不能修改已有属性的可枚举性、可配置性、可写性,但可能可以修改已有属性的值的对象
Object.isSealed():检测一个对象是否被密封sealed
- Object对象
- Object.prototype
Number对象
Boolean对象
Array对象
Function对象
- String对象
1 var myArr = new Array; 2 var str = 'this is a test hello ishello maizi'; 3 var patt = /is/ig; 4 var i = 0; 5 while ((myArr[i] = patt.exec(str)) !== null) 6 { 7 console.log(i + 1 + ':' + myArr[i] + " " + patt.lastIndex); 8 i++; 9 }10 11 str = 'this is a testis';12 patt = /is/ig;13 var res = str.match(patt);14 console.log(res);15 16 res = str.search(patt);17 console.log(res);18 19 res = str.replace(patt, '!');20 console.log(res);21 22 // 将年月日替换为月日年23 str = '2017-06-04';24 res = str.replace(/(\d{4})-(\d{2})-(\d{2})/, '$2-$3-$1');25 console.log(res);26 27 // 调用方法,将匹配到的内容替换成为hugh+匹配内容大写28 str = 'this is a testis';29 res = str.replace(/is/g, func);30 31 function func(match)32 {33 return 'hugh' + match.toLocaleUpperCase();34 }35 console.log(res);36 37 // split38 // 将匹配到的字符串前后拆分39 res = str.split(/\s+/);40 console.log(res);
- 工具类对象
Math对象
-
Date对象
1 // 显示当前时间 2 console.log(Date()); 3 // 显示毫秒数 4 var d = new Date(138555555550); 5 console.log(d); 6 // 显示填入的时间 7 var d = new Date(2011, 1, 3); 8 console.log(d); 9 // 传入月日10 var d = new Date(10,25);11 console.log(d);12 // Date提供的方法13 console.log(Date.now()); // 自1970年至今所经过的毫秒数14 console.log(Date.parse("2017-01-01")); // 解析一个字符串,返回所经过的毫秒数15 // ...
로그인 후 복사 -
RegExp对象
1 // 通过test()方法检索字符串中的内容,返回true或false 2 var patt1 = new RegExp("r"); 3 var res1 = patt1.test('this is javascript course'); 4 console.log(res1); 5 // 另一种形式 6 // 加上i表示忽略大小写 7 patt2 = /Javascript/i; 8 res2 = patt2.test('this is javascript course'); 9 console.log(res2);10 // 是否包含[]中的字符11 res3 = /[abc]/.test('Brlue');12 // 加上^表示除了abc之外的13 res4 = /[^abc]/.test('Brlue');14 // 检测是否包含数字15 res5= /[0-9]/.test('999');16 // 检测是否包含字母17 res5= /[a-z]/.test('999');18 // 是否出现了以下几个19 res5= /php|javascript|ios/.test('php');20 console.log(res3);21 console.log(res4);22 console.log(res5);
로그인 후 복사 - 错误对象
通常使用try/catch/finally来捕获Error错误
- Error类型
EvalError
InternalError
RangeError
ReferenceError
SyntaxError
TypeError
URIError
-
Error对象
1 try 2 { 3 // 当调用不存在的notExists(),e.name和e.message存放的错误名称和错误信息 4 // notExists(); 5 var n = 0; 6 if (n == 0) 7 { 8 // 手动抛出一个错误信息 9 throw new Error('Throw an error message');10 }11 }12 catch (e)13 {14 console.log(e.name);15 console.log(e.message);16 }17 finally18 {19 // finally中的总是被调用20 console.log('i am in finally');21 }22 23 try24 {25 notExists();26 }27 catch (e)28 {29 // 判断错误的实例化类型30 if (e instanceof EvalError)31 console.log('this is a EvalError');32 else if (e instanceof SyntaxError)33 console.log('this is a SyntaxError');34 else if (e instanceof ReferenceError)35 console.log('this is a ReferenceError');36 else37 console.log('An unknown errorr');38 }39 // 对Error对象重写40 function myError(msg)41 {42 this.name = "myError'sname";43 this.message = msg || "myError'info";44 }45 // 通过Object.create()创建错误原型46 myError.prototype = Object.create(Error.prototype);47 myError.prototype.constructor = myError;48 try49 {50 throw new myError();51 }52 catch (e)53 {54 console.log(e.name);55 console.log(e.message);56 }
로그인 후 복사
自定义对象
通过var obj = {} 对象字面量法
通过var obj = new Object()创建
-
通过函数构造创建对象
p.s. 使用的时候通过new操作符得到对象
用构造器创建对象的时候可以接收参数
构造器函数的首字母最好大写,区别其他的一般函数
当我们创建对象的时候,实际上同时也赋予了该对象一种特殊的属性,即构造器属性
这个构造器属性实际上是一个指向用于创建该对象的构造器函数的引用
function Person(){}
var Persion = function(){}
- 构造器属性(constructor property)
通过instanceof操作符可以检测一个对象是否由某个指定的函数构造器创建
通过Object.create()创建对象
1 /*********************************** 2 * 对象字面量 3 ***********************************/ 4 var oTest = {}; 5 document.write(typeof oTest + "</br>"); 6 var oTest2 = { x: 1, 'y': 2, "z": 3 }; 7 document.write(oTest2.x + " " + oTest2.y + " " + oTest2.z + "</br>"); 8 var oTest3 = { 9 username: 'rog91222',10 passwd: '123123',11 person: {12 firstname: "hugh",13 lastname: "dong"14 },15 age: 2016 }17 document.write(oTest3.username + " " + oTest3.person.firstname + " " + oTest3.age + "</br>");18 /***********************************19 * new Object()创建对象20 ***********************************/21 var oTest4 = new Object();22 /***********************************23 * 通过构造器函数的形式创建对象24 ***********************************/25 function funcTest(num1, num2) {26 this.n1 = num1;27 this.n2 = num2;28 }29 var oTest5 = new funcTest(1, 2);30 document.write(oTest5.n1 + " " + oTest5.n2 + "</br>");31 // 通过instanceof检测是否由函数构造器构造的32 document.write(oTest5 instanceof funcTest);33 document.write("<br>")34 /***********************************35 * 通过Object.create()创建对象36 ***********************************/37 var oTest6 = Object.create({ x: 1 });38 // 不继承任何方法39 var oTest7 = Object.create(null);40 // 创建一个普通的空对象41 var oTest8 = Object.create(Object.prototype);
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
对象特性
- 原型(prototype)
通过对象字面量的形式创建,则使用object.prototype作为它们的原型。
通过new和构造函数创建,则使用构造函数的prototype作为它们的原型。
-
如果通过Object.create()创建,使用第一个参数(或null)作为它们的原型
var obj = Object.create({ x: 1 });
类(class)
扩展标记(extensible flag)
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
对象的结构
声明对象obj,对象有2个属性 x=1,y=2,每个属性都有对应的属性特性,对象也有3个对象特性
-
对象的原型链:
如图所示,当在对象中找不到属性z时,会向方法的原型查找,继续向对象的原型查找,直到顶层null位置。
每个对象都和另外一个对象关联,就构成了一个原型链,每一个对象都从原型继承属性。
<
>
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
检测对象上是否有某个属性
in(包括原型上的)
- hasOwnProperty(仅检测对象自己有的属性)
1 function foo() {} 2 foo.prototype.z = 5; 3 var obj1 = new foo(); 4 obj1.x = 1; 5 obj1.y = 2; 6 console.log('x' in obj1); 7 console.log('y' in obj1); 8 console.log('toString' in obj1); 9 console.log('nonono' in obj1);10 console.log(obj1.hasOwnProperty('x'));11 console.log(obj1.hasOwnProperty('z'));
————————————————————————————————————————————
属性
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
数据属性:每个属性有4个描述行为的特性:
[writable]:是否能修改属性的值
[enumerable]:是否通过for in 循环返回属性(是否可以被枚举)
[configurable]:是否能通过delete删除,能否修改属性的特性,能否修改访问器属性
[value]:包含这个属性的数据值,读取属性值的时候从这个位置读取。默认值为undefined
存取器属性
get:获取属性的值
set:设置属性的值
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
属性操作
p.s. 正常属性名可以放在""''或不放引号内,但如果包含特殊字符、保留字、数字开头,必须放在引号之间
访问属性
添加属性
修改属性
删除属性
遍历属性
1 var person = 2 { 3 fName : 'hugh', 4 lName : 'dong', 5 age : 20 6 }; 7 // 通过.或[]来实现查询属性 8 console.log(person.fName); 9 console.log(person['lName']);10 console.log(person["age"]);11 // 如果属性不确定,需要使用[]来读取属性,此处key不能加引号12 var key = 'fName';13 console.log(person[key]);14 // 在对象内部通过this获取属性15 function PersonInfo(fName, lName, age)16 {17 this.firstName = fName;18 this.lastName = lName;19 this.year = age;20 }21 var person1 = new PersonInfo('wang', 'er', 30);22 console.log(person1.firstName);23 console.log(person1.lastName);24 console.log(person1.year);25 // 添加属性26 var obj = {};27 obj.userName = 'username';28 obj.passwd = '123456';29 obj['permissions'] = 'admin';30 console.log(obj.userName);31 console.log(obj.passwd);32 console.log(obj.permissions);33 // 修改属性34 obj.passwd = '123.com';35 console.log(obj.passwd);36 // 删除属性,删除后再打印该属性为undefined37 // p.s.delete只能删除自身的属性,不能删除集成的属性38 // 要删除继承属性,只能从定义它的属性的原型对象上删除它,会影响到所以继承这个原型的对象39 // delete只是断开属性和宿主对象的联系,而不会去操作属性的属性40 delete obj.permissions;41 console.log(obj.permissions);42 // 遍历属性43 // i存放的是属性名称,obj[i]存放的是属性值44 for (var i in obj)45 {46 console.log(i + ":" + obj[i]);47 }48 // 对象中有方法49 var obj1 =50 {51 user : '111',52 pass : '222',53 sayHi : function (x)54 {55 return this.user + x + 1;56 }57 }58 console.log(obj1.sayHi(3));
위 내용은 JavaScript 기본 사항 - 개체 및 속성의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

핫 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)

뜨거운 주제











얼굴 검출 및 인식 기술은 이미 상대적으로 성숙하고 널리 사용되는 기술입니다. 현재 가장 널리 사용되는 인터넷 응용 언어는 JS입니다. 웹 프런트엔드에서 얼굴 감지 및 인식을 구현하는 것은 백엔드 얼굴 인식에 비해 장점과 단점이 있습니다. 장점에는 네트워크 상호 작용 및 실시간 인식이 줄어 사용자 대기 시간이 크게 단축되고 사용자 경험이 향상된다는 단점이 있습니다. 모델 크기에 따라 제한되고 정확도도 제한됩니다. js를 사용하여 웹에서 얼굴 인식을 구현하는 방법은 무엇입니까? 웹에서 얼굴 인식을 구현하려면 JavaScript, HTML, CSS, WebRTC 등 관련 프로그래밍 언어 및 기술에 익숙해야 합니다. 동시에 관련 컴퓨터 비전 및 인공지능 기술도 마스터해야 합니다. 웹 측면의 디자인으로 인해 주목할 가치가 있습니다.

인터넷 금융의 급속한 발전으로 인해 주식 투자는 점점 더 많은 사람들의 선택이 되었습니다. 주식 거래에서 캔들 차트는 주가의 변화 추세를 보여주고 투자자가 보다 정확한 결정을 내리는 데 도움이 되는 일반적으로 사용되는 기술적 분석 방법입니다. 이 기사에서는 PHP와 JS의 개발 기술을 소개하고 독자가 주식 캔들 차트를 그리는 방법을 이해하도록 유도하며 구체적인 코드 예제를 제공합니다. 1. 주식 캔들 차트의 이해 주식 캔들 차트를 그리는 방법을 소개하기 전에 먼저 캔들 차트가 무엇인지부터 이해해야 합니다. 캔들스틱 차트는 일본인이 개발했습니다.

JavaScript 튜토리얼: HTTP 상태 코드를 얻는 방법, 특정 코드 예제가 필요합니다. 서문: 웹 개발에서는 서버와의 데이터 상호 작용이 종종 포함됩니다. 서버와 통신할 때 반환된 HTTP 상태 코드를 가져와서 작업의 성공 여부를 확인하고 다양한 상태 코드에 따라 해당 처리를 수행해야 하는 경우가 많습니다. 이 기사에서는 JavaScript를 사용하여 HTTP 상태 코드를 얻는 방법과 몇 가지 실용적인 코드 예제를 제공합니다. XMLHttpRequest 사용

js와 vue의 관계: 1. 웹 개발의 초석인 JS 2. 프론트엔드 프레임워크로서의 Vue.js의 등장 3. JS와 Vue의 상호 보완적인 관계 4. JS와 Vue의 실제 적용 Vue.

CSS의 하단 속성 구문 및 코드 예제 CSS에서 하단 속성은 요소와 컨테이너 하단 사이의 거리를 지정하는 데 사용됩니다. 상위 요소의 아래쪽을 기준으로 요소의 위치를 제어합니다. Bottom 속성의 구문은 다음과 같습니다. element{bottom:value;} 여기서 element는 스타일을 적용할 요소를 나타내고, value는 설정할 아래쪽 값을 나타냅니다. 값은 픽셀과 같은 특정 길이 값일 수 있습니다.

JavaScript에서 HTTP 상태 코드를 얻는 방법 소개: 프런트 엔드 개발에서 우리는 종종 백엔드 인터페이스와의 상호 작용을 처리해야 하며 HTTP 상태 코드는 매우 중요한 부분입니다. HTTP 상태 코드를 이해하고 얻는 것은 인터페이스에서 반환된 데이터를 더 잘 처리하는 데 도움이 됩니다. 이 기사에서는 JavaScript를 사용하여 HTTP 상태 코드를 얻는 방법을 소개하고 구체적인 코드 예제를 제공합니다. 1. HTTP 상태 코드란 무엇입니까? HTTP 상태 코드는 브라우저가 서버에 요청을 시작할 때 서비스가

절망의 실(Thread of Despair)은 블리자드 엔터테인먼트의 명작 '하스스톤'에 등장하는 희귀 카드로, '위즈베인의 작업실' 카드 팩에서 확률적으로 획득할 수 있습니다. 일반/골드 버전을 합성하려면 100/400 아케인 더스트 포인트를 소모할 수 있습니다. 하스스톤 절망의 실 속성 소개: 위즈베인의 작업실 카드 팩에서 확률적으로 획득할 수 있으며, 비전 가루를 통해 합성할 수도 있습니다. 희귀도: 희귀 유형: 주문 등급: 죽음의 기사 마나: 1 효과: 모든 하수인에게 죽음의 메아리를 줍니다: 모든 하수인에게 1 피해를 줍니다.

jQuery 요소에 특정 속성이 있는지 어떻게 알 수 있나요? jQuery를 사용하여 DOM 요소를 조작할 때 요소에 특정 속성이 있는지 확인해야 하는 상황이 자주 발생합니다. 이 경우 jQuery에서 제공하는 메소드를 사용하여 이 기능을 쉽게 구현할 수 있습니다. 다음은 jQuery 요소에 특정 속성이 있는지 확인하기 위해 일반적으로 사용되는 두 가지 방법을 특정 코드 예제와 함께 소개합니다. 방법 1: attr() 메서드와 typeof 연산자를 // 사용하여 요소에 특정 속성이 있는지 확인
