JS對(duì)象基礎(chǔ)

定義：對(duì)象是一個(gè)包含相關(guān)數(shù)據(jù)和方法的集合
創(chuàng)建方法：

1. 直接創(chuàng)建：

var obj = {};
var obj = {name:"Name", age:10};

2. 通過(guò)object創(chuàng)建：

var obj = new Object();

3.通過(guò)構(gòu)造函數(shù)創(chuàng)建：

function CreatObj() {
  this.name="Name";
  this.age=10;
}
var obj = new CreatObj();

對(duì)象成員：

1. 表示方法：
   • 對(duì)象.成員
   • 對(duì)象['成員']
     2.設(shè)置方法

obj.age = 10;
obj['name'] = 'Name'

"this"指針

this指向當(dāng)前代碼運(yùn)行時(shí)的對(duì)象

var obj1 = {
  age : 10,
  greeting: function() {
    return this.age;//返回的是10
  }
}

var person2 = {
  age : 20,
  greeting: function() {
    return this.age;//返回的是20
  }
}

修改方式：

1. call()

function fn() {
    console.log(this);
}
fn.call(); // 普通:this是window，嚴(yán)格:this是undefined
fn.call(null); // 普通:this是window，嚴(yán)格:this是null
fn.call(undefined); // 普通:this是window，嚴(yán)格:this是undefined

2. apply():與call相同，區(qū)別在于傳參。（call在給fn傳遞參數(shù)的時(shí)候，是一個(gè)個(gè)的傳遞值的；apply是把要給fn傳遞的參數(shù)值放在一個(gè)數(shù)組中進(jìn)行操作。）

function fn(num1, num2) {
    console.log(num1 + num2);
    console.log(this);
}
fn.call(obj , 100 , 200);
fn.apply(obj , [100, 200]);

3. bind():事先把fn的this改變?yōu)槲覀円胍慕Y(jié)果，并且把對(duì)應(yīng)的參數(shù)值準(zhǔn)備好，以后要用到了，直接的執(zhí)行即可,和apply、call不同就是不會(huì)馬上的執(zhí)行。

var tempFn = fn.bind(obj, 1, 2);
tempFn();

JSON

定義：JavaScript對(duì)象表示法（JSON）是用于將結(jié)構(gòu)化數(shù)據(jù)表示為JavaScript對(duì)象的標(biāo)準(zhǔn)格式，通常用于在網(wǎng)站上表示和傳輸數(shù)據(jù)（例如從服務(wù)器向客戶端發(fā)送一些數(shù)據(jù)，因此可以將其顯示在網(wǎng)頁(yè)上）。一個(gè) JSON 對(duì)象可以儲(chǔ)存在它自己的文件中，擴(kuò)展名為 .json。

注：數(shù)組對(duì)象也是一種合法的 JSON 對(duì)象。

使用：

1. 獲取：querySelector()

<header>
</header>

<section>
</section>

var header = document.querySelector('header');
var section = document.querySelector('section');

2. 加載：XMLHttpRequest()使我們能夠通過(guò)代碼來(lái)向服務(wù)器請(qǐng)求資源文件(如：圖片，文本，JSON)，可以更新小段內(nèi)容而不用重新加載整個(gè)頁(yè)面。

//1.保存一個(gè)即將訪問(wèn)的 URL 作為變量。
var requestURL = '#';
//2. 需要通過(guò) new 構(gòu)造函數(shù)的形式創(chuàng)建一個(gè)HTTP請(qǐng)求對(duì)象。
var request = new XMLHttpRequest();
//3.使用 open(<HTTP方法>， <URL>)` 函數(shù)打開(kāi)一個(gè)新的請(qǐng)求
request.open('GET', requestURL);
//4.設(shè)定請(qǐng)求類型為JSON，然后發(fā)送請(qǐng)求
request.responseType = 'json';
request.send();
//5.處理服務(wù)器返回?cái)?shù)據(jù)onload事件旨在請(qǐng)求成功后觸發(fā)
request.onload = function() {
  var superHeroes = request.response;//返回請(qǐng)求數(shù)據(jù)
  populateHeader(superHeroes);//定義見(jiàn)修改
  showHeroes(superHeroes);//定義見(jiàn)顯示
}

3. 修改：

function populateHeader(jsonObj) {
  var myH1 = document.createElement('h1');//創(chuàng)建<h1>節(jié)點(diǎn)
  myH1.textContent = jsonObj.squadName;//設(shè)置節(jié)點(diǎn)內(nèi)容
  header.appendChild(myH1);//將節(jié)點(diǎn)加入到<header>
}

對(duì)象文本轉(zhuǎn)換：

• parse（）: 接受字符串形式的JSON對(duì)象作為參數(shù)，并返回相應(yīng)的對(duì)象。。
• stringify(): 接收一個(gè)對(duì)象作為參數(shù)，返回一個(gè)對(duì)應(yīng)的JSON字符串。