5-①.JavaScript のオブジェクト(Object)

# Objectオブジェクト
> 警告: 記事に機械翻訳するものがあるので、学習メモとして保存され、参考学習用のみ

## 概要

JavaScriptネイティブで提供される「Object」オブジェクト(最初のOが大文字であることに注意)のための様々な方法を紹介します。

JavaScriptの他のオブジェクトはすべて`Object`オブジェクトから引き継がれます。つまり、それらのオブジェクトはすべて`Objectのインスタンス。

`Object`オブジェクトのネイティブメソッドには、`Object`自身のメソッドと`Objectのインスタンスメソッドの2種類があります。

** (1) `Object`オブジェクト自体のメソッド**。

「自身的アプローチ」とは`Object`オブジェクトに直接定義するアプローチ。

```javascript
object.print = function (o) {console.log(o)};
```

上記のコードでは`print`メソッドは`Object`オブジェクト上で直接定義されています。

**(2) `オブジェクト`の例の方法**

インスタンスメソッドとは、「Object」原型オブジェクト「object.prototype」上に定義されたメソッド。`Object`インスタンスで直接使うことができます。

```javascript
object.prototype.print = function () {
console.log(this);
};

var obj = new Object();
obj.print() // Object
```

上記のコードでは、` object.prototype `は`print`メソッドを定義し、`Object`のインスタンス`obj`を生成します。' obj 'は' object.prototype 'のプロパティとメソッドをそのまま引き継いでおり、' obj.print 'を使って' print 'メソッドを呼び出すことができます。つまり、`obj`オブジェクトの`print`メソッドは、実質的には` object.prototype.print `メソッドを呼び出すことになります。

object.prototypeの詳細な説明はオブジェクト指向プログラミングの項を参照されたいと思います。ここで、` object.prototype `オブジェクトの上に定義されている属性とメソッドは、インスタンスオブジェクト全体で共有されていることがわかればいいの。

以下では、まず関数としての`Object`の使い方を紹介した後、`Object`オブジェクトのネイティブなメソッドを紹介します。オブジェクト自体のメソッド(別名「静的メソッド」)とインスタンスのメソッドに分けます。

## Object()

`Object`はそれ自体が関数であり、任意の値をオブジェクトに変換するツールとして使うことができます。この方法は、ある値が必ず対象であることを保証するためによく使われます。

引数がnull(またはundefinedとnull)の場合、`Object()`は空のオブジェクトを返します。

```javascript
var obj = Object();
//に等しい
var obj = Object(undefined);
var obj = Object(null);

obj instanceof Object // true
```

上記のコードの意味は、`undefined`と`null`をオブジェクトに変換すると、空のオブジェクトである`obj`が得られます。

`instanceof`演算子は、オブジェクトが指定されたコンストラクタのインスタンスであるかを検証します。' obj instanceof Object 'が' true 'を返すと、' obj 'オブジェクトは' Object 'のインスタンスであることを意味します。

パラメータが元の型の値の場合、`Object`メソッドは対応するラッピングオブジェクトのインスタンスに変換します(「元の型のラッピングオブジェクト」の章を参照)。

```javascript
var obj = Object(1);
obj instanceof Object // true
obj instanceof Number // true

var obj = Object('foo');
obj instanceof Object // true
obj instanceof String // true

var obj = Object(true);
obj instanceof Object // true
obj instanceof Boolean // true
```

上記のコードでは、`Object`関数の引数は元の型の値であり、オブジェクトに変換すると元の型の値に対応するパッケージオブジェクトとなります。

もし`Object`メソッドのパラメータがオブジェクトであれば、オブジェクトは常にオブジェクトを返します。

```javascript
var arr =[];
var obj = Object(arr);//元の配列に戻ります
obj === arr // true

var value ={};
var obj = Object(value) //元のオブジェクトに戻ります
obj === value // true

var fn = function () {};
var obj = Object(fn);//元の関数に戻ります。
obj === fn // true
```

これを利用して、変数が対象かどうかを判定する関数を書くことができます。

```javascript
function isObject(value)
return value === Object(value);
}

isObject([]) // true
isObject(true) // false
```

## Objectコンストラクタ

`Object`はツールとしてだけでなくコンストラクタとしても使えます。つまり`new`コマンドを使うことができます。

「Object」コンストラクタの主な用途は、直接新しいオブジェクトを生成すること。

```javascript
var obj = new Object();
```

>なお、「var obj = new Object()」という書き方で新しいオブジェクトを生成することは、リテラルの書き方である「var obj ={}」と等価。あるいは、後者は前者の簡便な書き方。

`オブジェクト`コンストラクタの使い方は、ツールの使い方と似ていて、ほとんど同じ。使用する時、1つのパラメータを受け入れることができて、このパラメータが1つの対象ならば、直接この対象を返します;元の型の値の場合は、その値に対応するラッピングオブジェクトを返します(詳細はラッピングオブジェクトの章を参照)。

```javascript
var o1 = {a: 1};
var o2 = new Object(o1);
o1 === o2 // true。

var obj = new Object(123);
obj instanceof Number // true
```

使い方は似ていますが、「Object(value)」と「new Object(value)」では意味が異なります。「Object(value)」は「value」をオブジェクトに変換したもので、「new Object(value)」はオブジェクトを新たに生成したもの。その値は「value」。

## Objectの静的な手法

「静的メソッド」とは、`Object`オブジェクト自身に配置されたメソッドのこと。

### object . keys()、object . getownpropertynames ()

` object . keys方法や` ` . object getownpropertynames `方法も使わ遍暦対象の属性。

' object.keys 'メソッドの引数はオブジェクトで配列を返します配列のメンバは、オブジェクト自身の(継承されたのではなく)すべての属性名。

```javascript
var obj ={
p1: 123,
p2: 456
};

object.keys (obj) // ["p1", "p2"]
```

` object . getownpropertynames方法と` ` . object keys `同様、も一つ受ける対象パラメータとして、一つの配列に戻って、この対象自身のすべての属性人が含まれた。

```javascript
var obj ={
p1: 123,
p2: 456
};

object.getownpropertynames (obj) // [" p1、p2 "]
```

一般の対象にとって、` object . keys() ` `とobject . getownpropertynames() `帰った結果のようだ。結果が異なるのは、列挙できない属性についてのみ。` object . keys `方法は色々あるの属性に戻るだけ(キョンギド・ソンナムシ『対象の属性の描写対象』の一章)、` object . getownpropertynames `は方法は色々ある人の属性に戻った。

```javascript
var a = ['Hello', 'World'];

object.keys (a) // ["0", "1"]
object.getownpropertynames (a) //[" 1 "、" 1 "、" length]
```

上のコードのうち、配列の` length `属性は、色々あるの属性だけが` object . getownpropertynames `方法の結果のうちに帰った。

JavaScriptではオブジェクトの属性の数を計算する方法を提供していないため、この2つの方法で置き換えることができます。

```javascript
var obj ={
p1: 123,
p2: 456
};

object.keys (obj).length // 2
object.getownpropertynames (obj).length // 2
```

一般的には、オブジェクトのプロパティをトラバースするために、常に' object.keys 'メソッドを使用します。

### その他の方法

上記2つの手法以外にも、オブジェクトにはいくつかの静的な手法がありますので、後述します。

**(1)対象属性モデルの相関方法**。

- ` object . getownpropertydescriptor() `:ある属性の描写を対象になった。
- ` object.defineproperty()`:オブジェクトを記述することで、属性を定義します。
- ` object.defineproperties()`:オブジェクトを記述することで、複数の属性を定義します。

**(2)オブジェクトの状態を制御する方法**。

- ` object.preventextensions()`:オブジェクト拡張を防止します。
- ` object.isextensible()`:オブジェクトが拡張可能かどうかを判定します。
- ` object.seal()`:オブジェクト設定を禁止します。
- ` object.issealed()`:オブジェクトが構成可能かどうかを判定します。
- ` object.freeze()`:オブジェクトを1つ凍結します。
- ` object.isfrozen()`:オブジェクトが凍結されているかどうかを判定します。

**(3)原型チェーンの相関方法**。

- ` object.create()`:プロトタイプオブジェクトとプロパティを指定し、新しいオブジェクトを返す方法。
- ` object.getprototypeof()`:オブジェクトの`Prototype`オブジェクトを取得します。

## Objectの方法の例

静的なメソッド以外にも、いくつかのメソッドがobject.prototypeオブジェクトで定義されています。これらはインスタンスメソッドと呼ばれ、すべてのインスタンスオブジェクトはこれらのメソッドを継承します。

`Object`インスタンスオブジェクトの方法には、主に次の6つがあります。

- ` object.prototype.valueof()`:現在のオブジェクトに対応する値を返します。
- ` object . prototype . tostring() `:当面の対象に戻った対応のつづり形式。
- ` object . prototype . tolocalestring() `:当面の対象に対応した地元に戻るつづり形式。
- ` object . prototype . hasownproperty() `:ある属性判断が自身の属性を当面の対象か、それとも相続は原型対象の属性。
- ` object . prototype . isprototypeof() `:判断が当面の対象をもう一つの対象の原型のか。
- ` object . prototype . propertyisenumerable() `:ある属性判断できるかどうかが後を絶たない。

この項では最初の4つを紹介しますが、残りの2つは後述します。

### object.prototype.valueof()。

`valueOf`メソッドはオブジェクトの「値」を返すように機能します。デフォルトではオブジェクト自体を返します。

```javascript
var obj = new Object();
obj.valueof () === obj // true
```

上記のコードは` obj.valueof()`と`obj`自身を比較したものと同じ。

`valueOf`メソッドの主な用途は、JavaScriptの自動型変換時にデフォルトで呼び出されること(詳細は「データ型変換」の章を参照)。

```javascript
var obj = new Object();
1 + obj // "1[object object]"。
```

上のコードはオブジェクト`obj`と数字`1`を足します。この時JavaScriptはデフォルトで`valueOf()`メソッドを呼び出し、`obj`の値を求めて`1`を足します。つまり`valueOf`メソッドをカスタマイズすれば結果が得られます

```javascript
var obj = new Object();
obj.valueof = function () {
return 2;
};

1 + obj // 3
```

上のコードは`obj`オブジェクトの`valueOf`メソッドをカスタマイズしています`1 + obj`から`3`が得られますこれは、カスタムの「obj.valueof」で、「object.prototype.valueof」を上書きするようなもの。

### object . prototype . tostring ()

`toString`メソッドはオブジェクトの文字列形式を返すことで機能しますデフォルトでは型文字列を返します

```javascript
var o1 = new Object();
o1.tostring () // "[object object]"

var o2 = {a:1};
2.toString() // "[object object]"
```

上記のコードは、オブジェクトに対して「toString」メソッドを呼び出すと、オブジェクトの型を示す文字列「[object object]」が返されることを示しています。

文字列`[object object]`自体はあまり役に立ちませんが、カスタム`toString`メソッドを使うことで、オブジェクトを自動型変換時に意図した文字列形式にすることができます。

```javascript
var obj = new Object();

obj.toString = function () {
return 'hello';
};

obj + ' ' + 'world // "hello world"
```

上記のコードは、オブジェクトが文字列の加算に使われた場合、自動的に「toString」メソッドが呼び出されることを示しています。`toString`メソッドがカスタムされているので文字列`hello world`を返します。

配列、つづり、函数、い対象として、それぞれのカスタム`を配置したtostring `方法で覆われた` object . prototype . tostring `方法。

```javascript
[1, 2,3].toString() // "1,2,3"

'123'.toString() // "123"

(function(){
return 123;
}).toString()
// "function () {
// return 123;
//}"

(new Date()).toString()
// "Tue May 10 2016 09:11:31 GMT+0800 (CST)"
```

配列、文字列、関数、Dateオブジェクトは「toString」メソッドを呼び出しますが、「object object」を返すわけではありません。

### toString()の応用:データ型の判定

` object . prototype . tostring `方法対象のタイプにつづり、ために判断できる値のタイプである。

```javascript
var obj ={};
obj.tostring () // "[object object]"
```

上のコードはnullオブジェクトの`toString`メソッドを呼び出し、結果として`[object object]`という文字列を返します。これはデータの型を判断するのに非常に有用な方法。

実例が対象になるカスタム` tostring `方法、覆われて` object . prototype . tostring `方法、タイプを得るためつづり、最高に直接使用` object . prototype . tostring `方法。関数の`call`メソッドを使えば、任意の値でこのメソッドを呼び出すことができ、その値のタイプを判断するのに役立ちます。

```javascript
Object.prototype.toString.call(value)
```

上のコードはこの値を呼出す` value ` ` . object prototype . tostring `方法。

データの類型別の` object . prototype . tostring `方法値はつぎに帰った。

-数値:[object Number]`を返します。
-文字列:[object String]`を返します。
-ブール値:[object Boolean]`を返します。
- undefined: [object undefined]`を返します。
- null: [object null]`を返します。
-配列:[object Array]`を返します。
- argumentsオブジェクト:[object arguments]`を返します。
-関数:[object Function]`を返します。
- Errorオブジェクト:[object Error]`を返します。
- Dateオブジェクト:[object Date]`を返します。
- RegExpオブジェクト:[object RegExp]`を返します。
-その他のオブジェクト:[object object]`を返します。

つまり、` object . prototype . tostring `一値が何なのかがうかがえるタイプ。

```javascript
Object.prototype.toString.call(2) // "[object Number]"
Object.prototype.toString.call('') // "[object String]"
Object.prototype.toString.call(true) // "[object Boolean]"
Object.prototype.toString.call(undefined) // "[object Undefined]"
Object.prototype.toString.call(null) // "[object Null]"
Object.prototype.toString.call(Math) // "[object Math]"
Object.prototype.toString.call({}) // "[object Object]"
Object.prototype.toString.call([]) // "[object Array]"
```

この特性を利用すれば、`typeof`演算子よりも正確な型判定関数を書くことができます。

```javascript
var type = function (o){
  var s = Object.prototype.toString.call(o);
  return s.match(/\[object (.*?)\]/)[1].toLowerCase();
};

type({}); // "object"
type([]); // "array"
type(5); // "number"
type(null); // "null"
type(); // "undefined"
type(/abcd/); // "regex"
type(new Date()); // "date"
```

上記の「type」関数に加えて、ある種類のデータを特定することに特化した手法を加えることもできます。

```javascript
var type = function (o){
  var s = Object.prototype.toString.call(o);
  return s.match(/\[object (.*?)\]/)[1].toLowerCase();
};

['Null',
 'Undefined',
 'Object',
 'Array',
 'String',
 'Number',
 'Boolean',
 'Function',
 'RegExp'
].forEach(function (t) {
  type['is' + t] = function (o) {
    return type(o) === t.toLowerCase();
  };
});

type.isObject({}) // true
type.isNumber(NaN) // true
type.isRegExp(/abc/) // true
```

### object . prototype . tolocalestring ()

` object . prototype . tolocalestring ` `方法とtostring `帰還の結果が同じでも一値のつづり形式に帰った。

```javascript
var obj ={};
obj.tostring (obj) // "[object object]"。
obj.toLocaleString(obj) // "[object object]"
```

このメソッドの主な役割は、様々なオブジェクトが自分のバージョンの「toLocaleString」を実装し、特定の地域の値を返すインタフェースを残すこと。

```javascript
var person = {
  toString: function () {
    return 'Henry Norman Bethune';
  },
  toLocaleString: function () {
    return '白';
  }
};

person.toString() // Henry Norman Bethune
person.toLocaleString() // 白
```

上記のコードでは、`toString()`メソッドはオブジェクトの一般的な文字列形式を、`toLocaleString()`メソッドはローカルな文字列形式を返します。

現在、主に3つのオブジェクトがtoLocaleStringメソッドをカスタマイズしています。

−array . prototype . tolocalestring ()
−number . prototype . tolocalestring ()
—い. prototype . tolocalestring ()

例えば、日付のインスタンスオブジェクトの「toString」と「toLocaleString」の戻り値は異なり、「toLocaleString」の戻り値はユーザーが設定した地域と相関します。

```javascript
var date = new date();
date.tostring () // "Tue Jan 01 2018 12:01:33 GMT+0800 (CST)"
date.tolocalestring () // "1/01/2018, 12:01:33 PM"
```

### object . prototype . hasownproperty ()

` object . prototype . hasownproperty `方法を一つづりパラメータとして、一ボーア値に戻って、「この実例対象自身この属性を持つかどうか。

```javascript
var obj ={
p: 123
};

obj.hasOwnProperty('p') // true
obj.hasOwnProperty('toString') // false
```

上のコードではオブジェクトの`obj`自体が`p`属性を持っているので`true`を返します。`toString`属性は継承なので`false`を返します。

##リンク参照

−アクセルrauschmayer、[protecting objects in javascript] (http://www.2ality.com/2013/08/protecting-objects.html)
−kangax、[understanding delete] (http://perfectionkills.com/understanding-delete/)
−jon bretman、[type checking in javascript] (http://techblog.badoo.com/blog/2013/11/01/type-checking-in-javascript/)
——コディlindley、[5 parts thinkingシンク・アバウト・チューecmascript] (http://tech.pro/tutorial/1671/thinking-about-ecmascript-5-parts)
−bjorn tipling、[advanced objects in javascript] (http://bjorn.tipling.com/advanced-objects-in-javascript)
- Javier Marquez, [JavaScript properties are enumerable,writable and configurable] (http://arqex.com/967/javascript-properties-enumerable-writable-configurable)
−sella rafaeli、[外国javascriptデーター—binding] (http://www.sellarafaeli.com/blog/native_javascript_data_binding):アクセス関数を使ってmodelとviewの双方向バインディングを実現します
−lea verou、[copying object properties、the robust way] (http://lea.verou.me/2015/08/copying-properties-the-robust-way/)