jsオブジェクトをベースにしたプロパティやメソッドの操作を詳しく解説

高洛峰
リリース: 2017-02-08 17:48:18
オリジナル
780 人が閲覧しました

1. 概要

Java 言語では、独自のクラスを定義し、それらのクラスに基づいて使用するオブジェクトを作成できます。たとえば、User クラス、Hashtable クラスなどを定義することもできます。

現在、JavaScript には Date、Array、RegExp、String、Math、Number などの標準クラスがいくつかあり、プログラミングに非常に便利です。しかし、複雑なクライアント プログラムの場合、これだけでは十分ではありません。

Java とは異なり、Java2 は基本的にプログラミングのニーズを満たす多くの標準クラスを提供します。しかし、JavaScript が提供する標準クラスは非常に少なく、多くのプログラミングのニーズは自分で実装する必要があります。たとえば、JavaScript にはハッシュテーブルがありません。なので、キー値を扱うのは非常に不便です。

したがって、私は個人的に、完全な Javascript オブジェクト ビューは次のようになるべきだと考えています:

2. 基本概念

1. カスタム オブジェクト。

JS のオブジェクト拡張メカニズムに従って、ユーザーは Java 言語に似た JS オブジェクトをカスタマイズできます。

カスタムオブジェクトに対応するのは、Date、Array、MathなどのJS標準オブジェクトです。

2. プロトタイプ

JS では、プロトタイプを通じてオブジェクトに新しいプロパティとメソッドを追加する方法です。

プロトタイプを通じて、JS 標準オブジェクトに新しいプロパティとメソッドを追加できます。たとえば、String オブジェクトの場合は、新しいメソッド trim() を追加できます。

Java などの厳密なプログラミング言語とは異なり、実行時に JS オブジェクトに新しいプロパティを動的に追加できます。

三、構文規則

1、オブジェクト作成メソッド

1) オブジェクト初期化メソッド

形式: objectName = {property1:value1, property2:value2,…, propertyN:valueN}

propertyはオブジェクトのプロパティです

value は、オブジェクトの値です。例: var user={name: "user1",age:18};

var user={name: " user1" ",job:{salary:3000,title:programmer}

この方法で、オブジェクトのメソッドを初期化することもできます。例:

var user={name:“user1”,age:18,getName:function(){
 
return this.name;
 
}
 
}
ログイン後にコピー

以下では、次の定義を含むコンストラクター メソッドに焦点を当てます。属性とメソッドについては、コンストラクターのメソッドについても説明します。

2) コンストラクターメソッド

コンストラクターを記述し、新しいメソッドを通じてオブジェクトを作成します。コンストラクターには構築パラメーターを含めることができます

例:

function User(name,age){
 
this.name=name;
 
this.age=age;
 
this.canFly=false;
 
}
 
var use=new User();
ログイン後にコピー

2. オブジェクトの属性を定義します

1) JS の場合 3 種類のプロパティオブジェクトに対して定義できるのは、プライベート プロパティ、インスタンス プロパティ、クラス プロパティです。Java と同様、プライベート プロパティはオブジェクト内でのみ使用でき、インスタンス プロパティはオブジェクトのインスタンスを通じて参照する必要があり、クラス プロパティはオブジェクトを通じて直接参照できます。クラス名を参照します。

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);//正确的方式
 
alert(user.isChild);//报错:对象不支持此属性或方法
ログイン後にコピー

3) インスタンスのプロパティを定義するには 2 つの方法があります:

prototype メソッド、構文形式: functionName.prototype.propertyName=value

このメソッド, 文法形式: this.propertyName=value、次の例では this の位置に注意してください

上記の値には、文字、数字、オブジェクトを使用できます。

例:

function User(){ }
 
User.prototype.name=“user1”;
 
User.prototype.age=18;
 
var user=new User();
 
alert(user.age);
 
—————————————–
 
function User(name,age,job){
 
this.name=“user1”;
 
this.age=18;
 
this.job=job;
 
}
 
alert(user.age);
ログイン後にコピー

3) クラス属性定義

文法形式: functionName.propertyName=value

例:

function User(){ }
 
User.MAX_AGE=200;
 
User.MIN_AGE=0;
 
alert(User.MAX_AGE);
ログイン後にコピー

JS標準オブジェクトのクラス属性を参照:

Number.MAX_VALUE //最大値 Math.PI //Pi

4) 属性の定義については、上記のより正式な方法に加えて、非常に特殊な定義方法、構文形式 obj[index]=value

もあります。

例:

function User(name){
 
this.name=name;
 
this.age=18;
 
this[1]=“ok”;
 
this[200]=“year”;
 
}
 
var user=new User(“user1”);
 
alert(user[1]);
ログイン後にコピー

上記の例では、age 属性は this[1] を通じて取得できず、name 属性は this[0] を通じて取得できないことに注意してください。つまり、index メソッドを使用する必要があります。は、index メソッドで定義された属性を参照するために使用されますが、index メソッドでは定義されていません。通常の方法で参照する必要があります

3、オブジェクトのメソッドを定義します

1) JS のオブジェクトには 3 種類のメソッドを定義できます。 : Java と同様のプライベート メソッド、インスタンス メソッド、およびクラス メソッド:

プライベート メソッドは、オブジェクト内でのみ使用できます。

オブジェクト内で使用されるインスタンス メソッドは、オブジェクトがインスタンス化された後に使用する必要があります。

クラス メソッドは、

注: メソッドの定義は、上記のインデックス メソッドを通じて行うことはできません。

2) プライベート メソッドを定義する

プライベート メソッドはコンストラクター本体内で定義する必要があり、コンストラクター本体内でのみ使用できます。

構文形式: function methodName(arg1,…,argN){ }

例:

function User(name){
 
this.name=name;
 
function getNameLength(nameStr){
 
return nameStr.length;
 
}
 
this.nameLength=getNameLength(this.name);
 
}
ログイン後にコピー

3) インスタンス メソッドを定義する方法は現在 2 つあります:

プロトタイプ メソッド、コンストラクターの外部で使用、構文。形式:

functionName.prototype.methodName=method;

または

functionName.prototype.methodName=function(arg1,…,argN){};

このメソッドはコンストラクター内で使用されます。構文形式:

this .methodName=method;

または

this.methodName=function(arg1,...,argN){};

上記の構文の説明では、method は既存の外部メソッドであり、methodName はオブジェクトです。定義されるメソッドとは、オブジェクトのメソッドに外部メソッドを直接割り当てることを意味します。

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

定义实例方法的一些例子:例子1

function User(name){
 
this.name=name;
 
this.getName=getUserName;
 
this.setName=setUserName;
 
}
 
function getUserName(){
 
return this.name;
 
}
 
Function setUserName(name){
 
this.name=name;
 
}
ログイン後にコピー

定义实例方法的一些例子:例子2

function User(name){
 
this.name=name;
 
this.getName=function(){
 
return this.name;
 
};
 
this.setName=function(newName){
 
this.name=newName;
 
};
 
}
ログイン後にコピー

定义实例方法的一些例子:例子3

function User(name){
 
this.name=name;
 
}
 
User.prototype.getName=getUserName;
 
User.prototype.setName=setUserName();
 
function getUserName(){
 
return this.name;
 
}
 
Function setUserName(name){
 
this.name=name;
 
}
ログイン後にコピー

定义实例方法的一些例子:例子4

function User(name){
 
this.name=name;
 
}
 
User.prototype.getName=function(){
 
return this.name;
 
};
 
User.prototype.setName=function(newName){
 
this.name=newName;
 
};
ログイン後にコピー

4)定义类方法

类方法需要在构造函数外面定义,可以直接通过构造函数名对其进行引用。

语法格式:

functionName.methodName=method;

或者

functionName.methodName=function(arg1,…,argN){};

例子:

function User(name){
 
this.name=name;
 
}
 
User.getMaxAge=getUserMaxAge;
 
function getUserMaxAge(){
 
return 200;
 
}
ログイン後にコピー

或者

User.getMaxAge=function(){return 200;};

alert(User.getMaxAge());

4,属性与方法的引用

1)从可见性上说:

私有属性与方法,只能在对象内部引用。

实例属性与方法,可以在任何地方使用,但必须通过对象来引用。

类属性与方法,可以在任何地方使用,但不能通过对象的实例来引用(这与Java不同,在Java中静态成员可以通过实例来访问)。

2)从对象层次上说:

与Java bean的引用类似,可以进行深层次的引用。

几种方式:

简单属性: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,自定义对象机制,是JS最为吸引人的机制之一,对于C++和Java程序员而言,这简直太棒了!

2,对象创建存在两种方式:对象初始化器和构造函数。

3,对象属性和方法,具有可见性的约束,不同可见性的属性和方法,其定义方式也不一样。

以上这篇基于js对象,操作属性、方法详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持PHP中文网。

更多基于js对象,操作属性、方法详解相关文章请关注PHP中文网!

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート