Javascript 对象用法

简介: 一、基本概念 1,自定义对象。     根据JS的对象扩展机制,用户可以自定义JS对象。与自定义对象相对应的是JS标准对象,例如Date、Array、Math等等。2,原型(prototype)     在JS中,这是一种创建对象属性和方法的方式,通过prototype可以为对象添加新的属性和方法。
一、基本概念
1,自定义对象。
     根据JS的对象扩展机制,用户可以自定义JS对象。与自定义对象相对应的是JS标准对象,例如Date、Array、Math等等。
2,原型(prototype)
     在JS中,这是一种创建对象属性和方法的方式,通过prototype可以为对象添加新的属性和方法。通过prototype我们可以为JS标准对象添加新的属性和方法,例如对于String对象,我们可以为其添加一个新的方法trim()。我们可以在运行期间为JS对象动态添加新的属性。
 
二、语法规则

   1、对象创建方式

      1)对象初始化器方式
          格式:objectName = {property1:value1, property2:value2 , … , propertyN:valueN}
              property:对象的属性
              value:对象的值,值可以是字符串、数字或对象三者之一
         // 例:初始化User对象
         var  user1  =  { name:  " user1 " , age:  18  };
        alert(user1.name);

 

        // 例,初始化对象
         var  user  =  { name:  " User1 " , job: { salary:  3000 , title:  " programmer " } };
        alert(user.job.salary);

     

         // 例、初始化User对象
         var  user2  =  { name:  " user1 " , age:  18 , getName:  function  () {  return   this .name; } };
        alert(user2.getName());  

 

       后面将以构造函数方式为重点进行讲解,包括属性和方法的定义等等,也针对构造函数的方式进行讲解。

 

      2)构造函数方式
      编写一个构造函数,并通过new方式来创建对象,构造函数本可以带有构造参数
         // 编写构造函数
         function  User(name, age) {
        
// this.name:表示对象的属性
         this .name  =  name;
        
this .age  =  age;
        
this .canFly  =   false ;
        }

        
// 创建对象
         var  user1  =   new  User( " aaa " 100 );
        alert(user1.name);

 

  2、定义对象属性
    1)JS中可以为对象定义三种类型的属性:私有属性、实例属性和类属性。

        私有属性只能在对象内部使用。

        实例属性必须通过对象的实例进行引用。

        类属性可以直接通过类名进行引用。(相当于c#静态属性或变量)

    2)私有属性定义
        私有属性只能在构造函数内部定义与使用。
        语法格式:var propertyName=value;

         // 例、私有属性
         function  User(age) {
        
this .age  =  age;
        
// 定义私有属性,私有属性只能在对象内部使用,
         var  isChild  =  age  <   12 ;
        
this .isLittleChild  =  isChild;
        }

        
var  user  =   new  User( 15 );
        alert(user.isLittleChild);

 

    3)实例属性定义,也存在两种方式:
         prototype方式,语法格式:functionName.prototype.propertyName=value。
         this方式,语法格式:this.propertyName=value,注意后面例子中this使用的位置。
         上面中语法格式中的value可以是字符创、数字和对象。

         // prototype方式
         function  User() { };
        
// 实例属性
        User.prototype.name  =   " user1 " ;
        User.prototype.age 
=   18 ;
        
var  user  =   new  User();
        alert(user.name);

       
// this方式
         function  User(name, age) {
            
// this方式的实例属性
             this .name  =  name;
            
this .age  =  age;
        }

 

    4)类属性定义
        语法格式:functionName.propertyName=value
         function  User() { };
        User.Max_Age 
=   200 ;
        User.Min_age 
=   0 ;
        alert(User.Max_Age);

 

    5)对于属性的定义,除了上面较为正规的方式外,还有一种非常特别的定义方式,语法格式: obj[index]=value
       function  User(name) {
        
this .name  =  name;
        
this .age  =   18 ;
        
this [ 1 =   " ok " // 以Index方式定义
         this [ 200 =   " year " ;
        }
        
var  user  =   new  User( " user1 " );
        alert(user[
1 + "   " +  user[ 200 ]);

     注意:通过index方式定义的必须使用index方式来引用,而没有通过index方式定义的,必须以正常方式引用。

 

  3、定义对象方法
    1)JS中可以为对象定义三种类型的方法:私有方法、实例方法和类方法:
         私有方法只能在对象内部使用
         实例方法必须在对象实例化后才能使用
         类方法可以直接通过类名去使用。(相当于c#静态方法)
         注意:方法的定义不能通过前面所说的index方式进行。

 

    2)定义私有方法
        私有方法必须在构造函数体内定义,而且只能在构造函数体内使用。
        语法格式:function methodName( arg1 , … , argN){ } 

         function  User(name) {
        
this .name  =  name;
        
// 私有方法
         function  getNameLengh(nameStr) {
        
return  nameStr.length;
        }

        
this .nameLength  =  getNameLengh( this .name);
        }
        
var  user  =   new  User( " aaron " );
        alert(user.nameLength);

 

    3)定义实例方法

        目前也可以使用两种方式:

        prototype方式,在构造函数外使用,语法格式:functionName.prototype.methodName=method;
                               或者 functionName.prototype.methodName=function(arg1,…,argN){};
        this方式,在构造函数内部使用,语法格式:this.methodName=method;
                               或者  this.methodName=function(arg1 , … ,argN){};
        上面的语法格式描述中,method是外部已经存在的一个方法,methodName要定义的对象的方法,意思就是将外部的一个方法直接赋给对象的某个方法。

         以function(arg1,…,argN){}的方式定义对象方法是开发人员应该掌握的。  

         // prototype方式
         function  User(name) {
        
this .name  =  name;
        
// 实例方法。
         this .getName  =  getUserName;
        
this .setName  =   function  (name) {  this .name  =  name; };
        }
        
function  getUserName() {
        
return   this .name;
        }

        
var  user  =   new  User( " aaron " );
        alert(user.getName());

        
// this方式
         function  User(name) {
        
this .name  =  name;
        
this .getName  =   function  () {
        
return   this .name;
        };
        
this .setName  =   function  (newName) {
        
this .name  =  newName
        }
        }

        
var  user  =   new  User( " aaron " );
        alert(user.getName());

 

         // 定义实例方法其它的一些例子
         function  User(name) {
        
this .name  =  name;
        }
        User.prototype.getName 
=   function  () {  return   this .name; };
        User.prototype.setName 
=  setUserName;
        
function  setUserName(name) {
        
this .name  =  name;
        }

        
var  user  =   new  User( " Aaron " );
        alert(user.getName());

  

    4)定义类方法
         类方法需要在构造函数外面定义,可以直接通过构造函数名对其进行引用。
         语法格式:functionName.methodName=method;
         或者 functionName.methodName=function(arg1 , … , argN){};
         // 写法1
         function  User(name) {
        
this .name  =  name;
        }       
        User.getMaxAge 
=  getUserMaxAge;
        
function  getUserMaxAge() {
        
return   200 ;
        }
        alert(User.getMaxAge());

        
// 写法2
         function  User(name) {
        
this .name  =  name;
        }      
        User.getMaxAge 
=   function  () {  return   200 ; };
        alert(User.getMaxAge());

  4、属性与方法的引用
    1)从可见性上说:
         私有属性与方法,只能在对象内部引用。
         实例属性与方法,可以在任何地方使用,但必须通过对象来引用。
         类属性与方法,可以在任何地方使用,但不能通过对象的实例来引用

 

    2)从对象层次上说:
        可以进行深层次的引用。几种方式:
           简单属性:obj.propertyName
           对象属性:obj.innerObj.propertyName
           索引属性:obj.propertyName[index]
          对于更深层次的引用与上面类似。

    3)从定义方式上说:
         通过index方式定义的属性,必须通过index方式才能引用。
         通过非index方式定义的属性,必须通过正常的方式才能引用。
         另外注意:对象的方法不能通过index方式来定义。

  5、属性与方法的动态增加和删除
    1)对于已经实例化的对象,我们可以动态增加和删除它的属性与方法,语法如下(假定对象实例为obj):
         动态增加对象属性 obj.newPropertyName=value;
         动态增加对象方法  obj.newMethodName=method或者=function(arg1,…,argN){}
         动态删除对象属性  delete obj.propertyName
         动态删除对象方法  delete obj.methodName
   
    2)例子:

 

     function  User(name){
             
this .name = name;
             
this .age = 18 ;
    }
    
var  user = new  User(“user1”);
    user.sister
= “susan”;
    alert(user.sister);
// 运行通过
     delete  user.sister;
    alert(user.sister);
// 报错:对象不支持该属性

    user.getMotherName
= function (){ return  “mary”;}
    alert(user.getMotherName());
// 运行通过
     delete  user.getMotherName;
    alert(user.getMotherName());
// 报错:对象不支持该方法
目录
相关文章
|
1月前
|
JavaScript 前端开发
如何在 JavaScript 中使用 __proto__ 实现对象的继承?
使用`__proto__`实现对象继承时需要注意原型链的完整性和属性方法的正确继承,避免出现意外的行为和错误。同时,在现代JavaScript中,也可以使用`class`和`extends`关键字来实现更简洁和直观的继承语法,但理解基于`__proto__`的继承方式对于深入理解JavaScript的面向对象编程和原型链机制仍然具有重要意义。
|
1月前
|
Web App开发 JavaScript 前端开发
如何确保 Math 对象的方法在不同的 JavaScript 环境中具有一致的精度?
【10月更文挑战第29天】通过遵循标准和最佳实践、采用固定精度计算、进行全面的测试与验证、避免隐式类型转换以及持续关注和更新等方法,可以在很大程度上确保Math对象的方法在不同的JavaScript环境中具有一致的精度,从而提高代码的可靠性和可移植性。
|
26天前
|
JSON 前端开发 JavaScript
JavaScript中对象的数据拷贝
本文介绍了JavaScript中对象数据拷贝的问题及解决方案。作者首先解释了对象赋值时地址共享导致的值同步变化现象,随后提供了五种解决方法:手动复制、`Object.assign`、扩展运算符、`JSON.stringify`与`JSON.parse`组合以及自定义深拷贝函数。每种方法都有其适用场景和局限性,文章最后鼓励读者关注作者以获取更多前端知识分享。
18 1
JavaScript中对象的数据拷贝
|
26天前
|
JavaScript 前端开发
js中的bind,call,apply方法的区别以及用法
JavaScript中,`bind`、`call`和`apply`均可改变函数的`this`指向并传递参数。其中,`bind`返回一个新函数,不立即执行;`call`和`apply`则立即执行,且`apply`的参数以数组形式传递。三者在改变`this`指向及传参上功能相似,但在执行时机和参数传递方式上有所区别。
25 1
|
26天前
|
JavaScript 前端开发
JS中的构造函数的含义和用法
构造函数是JavaScript中用于创建新对象的特殊函数,通常首字母大写。通过`new`关键字调用构造函数,可以初始化具有相同属性和方法的对象实例,从而实现代码复用。例如,定义一个`Person`构造函数,可以通过传入不同的参数创建多个`Person`对象,每个对象都有自己的属性值。此外,构造函数还可以包含方法,使每个实例都能执行特定的操作。构造函数的静态属性仅能通过构造函数本身访问。ES6引入了`class`语法糖,简化了类的定义和实例化过程。
24 1
|
1月前
|
JavaScript 前端开发 图形学
JavaScript 中 Math 对象常用方法
【10月更文挑战第29天】JavaScript中的Math对象提供了丰富多样的数学方法,涵盖了基本数学运算、幂运算、开方、随机数生成、极值获取以及三角函数等多个方面,为各种数学相关的计算和处理提供了强大的支持,是JavaScript编程中不可或缺的一部分。
|
2月前
|
JavaScript 前端开发
JS try catch用法:异常处理
【10月更文挑战第12天】try/catch` 是 JavaScript 中非常重要的一个特性,它可以帮助我们更好地处理程序中的异常情况,提高程序的可靠性和稳定性。
26 1
|
2月前
|
JavaScript 前端开发
js的math.max的用法
js的math.max的用法
49 6
|
2月前
|
JavaScript
JS中的splice的三种用法(删除,替换,插入)
JS中的splice的三种用法(删除,替换,插入)
256 4
|
2月前
|
存储 JavaScript 前端开发
JavaScript 对象的概念
JavaScript 对象的概念
42 4