> 웹 프론트엔드 > JS 튜토리얼 > js 객체란 무엇입니까? js 객체 소개(코드 포함)

js 객체란 무엇입니까? js 객체 소개(코드 포함)

不言
풀어 주다: 2018-08-14 09:55:40
원래의
3293명이 탐색했습니다.

이 기사에서는 js 객체가 무엇인지 설명합니다. js 객체(코드 포함)의 소개에는 특정 참조 가치가 있습니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

객체란 무엇입니까

JavaScript에서 객체는 별도의 속성과 유형을 가진 엔터티와 같습니다. 컵은 객체이고 컵은 색상, 무게와 같은 속성을 갖습니다. 마찬가지로 JavaScript 객체에는 해당 특성을 정의하는 속성이 있습니다.
메서드는 객체와 연관된 함수입니다. 즉, 메소드는 값이 함수인 객체 속성입니다.
객체는 다음 범주로 나눌 수 있습니다.

  • 내장 객체/네이티브 객체

는 JavaScript 언어에 의해 사전 정의된 객체입니다.

  • 호스트 객체

는 JavaScript 런타임 환경에서 제공되는 객체입니다

  • 정의된 객체

는 개발자가 독립적으로 생성한 객체입니다.

객체 객체

객체 유형은 참조 유형입니다. 그러나 객체 유형은 JavaScript의 모든 유형의 상위입니다(모든 유형의 객체는 객체의 속성 및 메서드일 수 있음)

객체 생성

/*
* 1. 对象的初始化器创建方式
*     var 对象名={
*      属性名 : 属性值
*      方法名 : function{
*         方法体
*      }
*    }
*/
var obj = {
    name : '九筒',
    age : 2,
    sayYou : function () {
        console.log('火锅')
    }
};

/* 2. 对象的构造函数方式
*      * 利用所有的引用类型创建对应的对象->具有具体的类型
*        var num = new Number;//number类型
*        var str = new String;//string类型
*        var boo = new Boolean;//boolean类型
*      * 利用Object作为构造函数创建对象
*        var 对象名 = new Object();
*        var 对象名 = Object();
*/
var num = new Number();
var str = new Storage();
var boo = new Boolean();

var obj2 = new Object();
var obj3 = Object();

/*   利用Object.create创建对象
*      var 对象名 = Object.create(null) -> 创建一个空对象
      var 对象名 = Object.create(obj)
      * obj - 表示另一个对象
      * 特点 - 当前创建的新对象拥有与obj对象相同的属性和方法*/
var obj4 = Object.create(null);
var obj5 = Object.create(obj);
로그인 후 복사

Properties of Object

Defining Properties of Object

객체의 속성은 연결된 변수와 같습니다. 객체에

/*对象介意定义多个属性
*  属性之间使用逗号分开*/
var obj = {
    name : '吴凡',
    age : 23,
    book : function () {
        console.log('暗毁')
    }
};
로그인 후 복사

객체의 속성 호출

/*  调用对象的属性
*     对象名.属性名
*     不适用于复杂命名的属性名称*/
console.log(obj.name);

/*   对象名[属性名]-通用方式
     适用于复杂命名的属性名称
*     */
console.log(obj['name']);//属性名是字符串形式
로그인 후 복사

객체의 속성 추가, 삭제, 수정

var obj = {
    name : '火锅',
    variety : '比熊',
    age : function () {
        console.log('3')
    }
}
   /* 新增对象的属性
   *    1对象名.新的属性名 = 属性值
   *    2对象名[新的属性名] = 属性值*/
obj.col='白色';
console.log(obj.col);//白色

   /*删除对象的属性
   * delete 对象名.属性名
   * delete 对象名[属性名]*/
delete obj.col
console.log(obj.col);//undefined

  /*修改对象的属性
  * 对象名.已存在的属性名 = 属性值
  * 对象名[已存在的属性名] = 属性值*/
obj.name = '九筒';
console.log(obj.name);//九筒
로그인 후 복사

객체의 속성 감지

var obj = {
    name : '火锅',
    variety : '比熊',
    age : function () {
        console.log('3')
    }
};
console.log(obj.name)

/*   1. 判断对象的属性值是否为undefined*/
if (obj.name !==undefined){
    console.log('obj对象name属性存在')
}else{
    console.log('obj对象name属性不存在')
}

/*   2. 判断对象的属性值,先转换为boolean类型*/
if (obj.name){
    console.log('obj对象name属性存在')
}

/*   3. 利用in关键字进行判断*/
if ('name' in obj){
    console.log('obj对象name属性存在')
}else{
    console.log('obj对象name属性不存在')
}

/*   4. Object类型提供了hasOwnProperty()方法*/
if (obj.hasOwnProperty('name')){
    console.log('obj对象name属性存在')
}else{
    console.log('obj对象name属性不存在')
}
로그인 후 복사

편리한 속성

var obj = {
    name : '小薄荷',
    age : '0.3',
    variety : function () {
        console.log('萨摩耶')
    }
};
// 1.for...in语句
for (var objAttr in obj) {
    // 通过对象属性或方法对应的值的类型进行区别
    if (obj[objAttr] instanceof Function) {
        // 当前是对象的方法
        obj[objAttr]();
    } else {
        // 当前是对象的属性
        console.log(obj[objAttr]);
    }
}

// 2.Object类型提供了keys()方法 - 只能遍历可枚举的属性
var arr = Object.keys(obj);
for (var v in arr) {
    var objAttr = arr[v];
    // 通过对象属性或方法对应的值的类型进行区别
    if (obj[objAttr] instanceof Function) {
        // 当前是对象的方法
        obj[objAttr]();
    } else {
        // 当前是对象的属性
        console.log(obj[objAttr]);
    }
}

// 3.Object类型提供了getOwnPropertyNames()方法 - 包括不可枚举的属性
var arr = Object.getOwnPropertyNames(obj);
for (var v in arr) {
    var objAttr = arr[v];
    // 通过对象属性或方法对应的值的类型进行区别
    if (obj[objAttr] instanceof Function) {
        // 当前是对象的方法
        obj[objAttr]();
    } else {
        // 当前是对象的属性
        console.log(obj[objAttr]);
    }
}
로그인 후 복사

객체의 메소드

호출, 추가, 수정 및 삭제 방법 객체

객체 호출, 추가, 수정, 삭제 방법과 속성은 기본적으로 동일합니다

var obj = {
    name : '火锅',
    variety : '比熊',
    age : function () {
        console.log('3')
    }
}

/*调用对象的方法*/
// 1.对象名.方法名()
obj.sayMe();
// 2.对象名[方法名]()
obj['sayMe']();

/*新增对象的方法*/
// 1.对象名.新的方法名 = function(){}
obj.name = function(){
    console.log('九筒');
}
console.log(obj);
// 2.对象名[新的方法名] = function(){}

/*修改对象的方法*/
// 1.对象名.方法名 = function(){}
obj.name = function(){
    console.log('九筒');
}
// 2.对象名[方法名] = function(){}

/*删除对象的方法*/
//1.delete 对象名.方法名
delete obj.sayMe;
// 访问对象中不存在的方法 -> 报错(TypeError: obj.sayMe is not a function)
// obj.sayMe();
// 2.delete 对象名[方法名]
로그인 후 복사

관련 권장 사항:

js의 문자 메소드 및 문자열 연산 방법 요약(코드 있음)

분석 http 프록시 라이브러리의 일반적인 문제 nodejs

의 http-proxy

위 내용은 js 객체란 무엇입니까? js 객체 소개(코드 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿