JavaScript オブジェクトを 1 つの記事でマスターする

let child = {
	name:'Tom',
	age:8,}

let nullObj1 = {};		
//创建也给空的对象let nullObj2 = new Object();	
//同样创建了一个空对象

let child = {
	name:'Tom',
	age:8,};console.log(child.name);console.log(child.age)

let child = {
	name:'Tom',
	age:8,}child.height = 800;//创建了一个新的属性heightconsole.log(child.height);

let child={
	name:'Tom',
	age:8,}child.age=12;console.log(child);

let child = {
	name:'Tom',
	age:8,}delete child.age;console.log(child);

let child={
	name = 'Tom',
	age:8,
	"favorite cat":'Jerry',}

child.favorite cat = 'Bob'; //语法错误

let child={
	name:'Tom',
	age:8,
	"favorite cat":'Jerry',}console.log(child['favorite cat']);

let child = {
	name:'Tom',
	age:8,}child['favorite cat']='Jerry';	
	//增加属性child['name']='Bob';			
	//修改属性delete child['age'];			
	//删除数console.log(child['name']);		
	//查看属性

let child = {
	name:'Tom',
	age:8,}let prop = 'name';console.log(child[prop]);prop='age';console.log(child[prop]);

let child = {
	prop1:0,
	prop2:1,
	prop3:2,}let prop = 'prop';for(let i=1;i<p>在这里，范围属性值的<code>key</code>是通过计算得到的，这一功能用<code>.</code>是不能实现的。</p><h2>计算属性</h2><p>在创建对象时，我们还可以通过变量指定对象的键名，此类属性叫做<strong>计算属性</strong>。</p><p>举个例子：</p><pre class="brush:php;toolbar:false">let propName = 'name';let child ={
	[propName]:'Tom',
	age:8,}

> let propName = 'name';
> let child ={
 	[propName]:'Tom',
 	age:8,
> }
> undefined
> child
> {name: 'Tom', age: 8}

let propName='name';let child = {
	age:8,}child[propName]='Tom';

let child = {['prop' + 2 * 3]:'Tom',}

> let child = {
	['prop'+2*3]:'Tom',
  } child<h2>属性简写</h2><p>在实际应用中，或者匿名对象中，我们常常会使用和变量同名的属性，举个例子：</p><pre class="brush:php;toolbar:false">let name = 'Tom';let age = 8;let child = {
	name:name,	//属性名和变量名一样，都是name
	age:age,};

let name = 'Tom';let age = 8;let child = {
	name, // 等同于name:name;
	age,}

> let name = 'Tom';
  let age = 8;
  let child = {
		name,
		age,
  } child<h2>属性命名</h2><p>和变量命名不同，我们几乎可以使用任何值作为属性的名称，包括关键字和数字：</p><h3>关键字作为变量名</h3><p>虽然听起来不可思议，实际上，所有的关键字都可以作为对象的属性名：</p><pre class="brush:php;toolbar:false">let obj = {
	for:0,
	while:1,
	function:2,
	alert:3,}

> let obj = {
  	for:0,
  	while:1,
  	function:2,
  	alert:3,
  } obj<h3>数字作为关键字</h3><p>数字也可以作为关键字的名称，如下：</p><pre class="brush:php;toolbar:false">let obj = {
	0:'Number',//隐式转换为"0"
	1:'Number',}console.log(obj['0']);

let obj = {};obj.__proto__ = 1;console.log(obj.__proto__);

let obj = {};if(obj.someProp === undefined){
	...}

let obj = {
	prop : undefined}obj.prop === undefined ? console.log('no'):console.log('yes');

> let obj = {
  	prop : undefined
  }
  obj.prop === undefined ? console.log('no'):console.log('yes');
  no<p>虽然<code>prop</code>是存在的，但是以上案例并不能正确的返回结果。</p><p>这个时候就需要使用<code>in</code></p><pre class="brush:php;toolbar:false">let obj = {
	prop:undefined,};if('prop' in obj){
	console.log('yes');}else{
	console.log('no');}

> let obj = {
  	prop:undefined,
  };
  if('prop' in obj){
  	console.log('yes');
  }else{
  	console.log('no');
  }<h2>属性遍历</h2><p>如果我们不知道对象中都存在什么属性，如何取得所有的属性值呢？<br> 这时候就需要使用<code>for .. in ..</code>语句了，它类似于<code>for</code>循环，但是更简洁。</p><p><strong>语法</strong></p><pre class="brush:php;toolbar:false">for (key in obj){
	...}

let child = {
	name:'Tom',
	age:8,
	height:180,}for (let key in child){
	console.log(key+':'+child[key]);}

> let child = {
  	name:'Tom',
  	age:8,
  	height:180,
  }

  for (let key in child){
  	console.log(key+':'+child[key]);
  }<h2>属性顺序</h2><p>当我们创建一个对象并遍历其中所有的属性时，属性是如何排列的呢？答案是：特别的顺序排列，并遵循以下规则：</p><ol>
<li>数字属性以数字顺序排列；</li>
<li>其他属性按照创建顺序排列；</li>
<li>数字属性在其他属性之前；</li>
</ol><p>举个例子：</p><pre class="brush:php;toolbar:false">let obj = {
	name:'Tom',
	age:99,
	7:'7',
	1:'1',
	9:'9',}for (let key in obj){
	console.log(key+':'+obj[key]);}

> let obj = {
  	name:'Tom',
  	age:99,
  	7:'7',
  	1:'1',
  	9:'9',
  }
  for (let key in obj){
  	console.log(key+':'+obj[key]);
  }<p>【相关推荐：<a href="//m.sbmmt.com/course/list/17.html" target="_blank" textvalue="javascript视频教程">javascript视频教程</a>、<a href="//m.sbmmt.com/course/list/1.html" target="_blank">web前端</a>】</p>