JavaScript 对象

JS对象基础

定义：对象是一个包含相关数据和方法的集合
创建方法：

直接创建：

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

通过object创建：

var obj = new Object();

3.通过构造函数创建：

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

对象成员：

表示方法：
- 对象.成员
- 对象['成员']
  2.设置方法

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

"this"指针

this指向当前代码运行时的对象

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

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

修改方式：

call()

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

apply():与call相同，区别在于传参。（call在给fn传递参数的时候，是一个个的传递值的；apply是把要给fn传递的参数值放在一个数组中进行操作。）

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

bind():事先把fn的this改变为我们要想要的结果，并且把对应的参数值准备好，以后要用到了，直接的执行即可,和apply、call不同就是不会马上的执行。

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

JSON

定义：JavaScript对象表示法（JSON）是用于将结构化数据表示为JavaScript对象的标准格式，通常用于在网站上表示和传输数据（例如从服务器向客户端发送一些数据，因此可以将其显示在网页上）。一个 JSON 对象可以储存在它自己的文件中，扩展名为 .json。

注：数组对象也是一种合法的 JSON 对象。

使用：

获取：querySelector()

<header>
</header>

<section>
</section>

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

加载：XMLHttpRequest()使我们能够通过代码来向服务器请求资源文件(如：图片，文本，JSON)，可以更新小段内容而不用重新加载整个页面。

//1.保存一个即将访问的 URL 作为变量。
var requestURL = '#';
//2. 需要通过 new 构造函数的形式创建一个HTTP请求对象。
var request = new XMLHttpRequest();
//3.使用 open(<HTTP方法>， <URL>)` 函数打开一个新的请求
request.open('GET', requestURL);
//4.设定请求类型为JSON，然后发送请求
request.responseType = 'json';
request.send();
//5.处理服务器返回数据onload事件旨在请求成功后触发
request.onload = function() {
  var superHeroes = request.response;//返回请求数据
  populateHeader(superHeroes);//定义见修改
  showHeroes(superHeroes);//定义见显示
}

修改：

function populateHeader(jsonObj) {
  var myH1 = document.createElement('h1');//创建<h1>节点
  myH1.textContent = jsonObj.squadName;//设置节点内容
  header.appendChild(myH1);//将节点加入到<header>
}

对象文本转换：

parse（）: 接受字符串形式的JSON对象作为参数，并返回相应的对象。。
stringify(): 接收一个对象作为参数，返回一个对应的JSON字符串。

最后编辑于：2019.12.20 16:13:54