引用数据类型也叫对象 object ,

引用数据类型的数据格式有 json ,数组,函数,DOM的元素对象等等

alert不能弹出object所以内容,所以调试object数据类型的时候一般使用console.log()进行调试。

一、数组

数组也叫 list,可以把他想象成一个序号是从0开始的列表清单,每个序号对应一个值,值可以是任意数据类型;

数组对象有个默认的特有属性length,代表数组所存储的数据个数,length属性的计数会自动添加。数组的下标不是一定是顺号。length的值跟最大下标没有关系,只跟数据数量有关系。

1 <body>
 2     <div id="wrap"></div>
 3     <script>
 4         var a = [
 5         1,
 6         2,
 7         "haha",    
 8         function (){
 9             alert(1);
10             },
11         [1,"xixi",5],
12         {"name":"bibi","age":18}
13         ];
14         console.log(a);
15     </script>
16 </body>

 console.log(a)的结果。

java中数组引用类型 数组引用数据类型_数组

读取数组的某个特定的值需要通过他的下标(序号索引)去查找调用,格式如下:

1 console.log(a[0]);   //1
2 console.log(a[1]);   //2
3 console.log(a[2]);  //haha
4 console.log(a[4][1]); //xixi
5 console.log(a[5].name); //bibi

 

二、json对象

一、JSON :javascript对象表示法(Javascript Object Notation) 是一种轻量级的数据交换格式。

JSON 语法是 JavaScript 对象表示语法的子集。是存储和交换文本信息的语法,类似于XML,python的词典,

前端为后端传输数据的常用格式,因为每个后端语言都支持这种格式,所以json一般都是用来给后端传输数据。

数组和json的区别,数组的数据以下标查找,所以当需要去更详细描述每条数据代表的意思的时候,数组没办法去表示,而json可以。

数组通常用来存储一组类型相同的数据,以下标读取数据:a[0] 的数据是老郭 ,

json以键,每组数据是一组键值对,json对象名.键读取,比如 b.name 的数据是老郭。

json都键只在前端调用的时候可以加引号也可以不加引号,当json的数据是要传给后端的时候,就要给键值对都加上引号。

json的键 只能是基础数据类型的数据,而值可以是任何数据类型。而且值可以是某一个变量。但是键(属性)不可以。

已经创建的json和数组添加新值的时候直接用点操作和下标操作就可以了,如果已经存在值了,会被新值覆盖。

1 <body>
 2     <div id="wrap"></div>
 3     <script>
 4         var num = 18 ;
 5         var a = [
 6             "老郭",
 7             18,
 8             180,
 9             "男"
10         ];
11         var b = {
12             "name":"老郭",
13             "age":num,    //键age 的值是变量 num的值。
14             "height":"180cm",
15             "sex":"男"
16         }
17     </script>
18 </body>

 

注意:几乎所有对象的 .  操作都可以用中括号来代替,中括号里的键一定要加引号,但是我们一般不这么用,一般都是直接 .  操作就可以了。

但是数组的中括号下标读取不能使用.操作替代。

1 console.log(b.name === b["name"]); // ture
2 var k = "name";  //b["name"]的方式读取的时候,括号里的"name"可以当成一个独立的字符串。
3 console.log(b[k]);  //老郭
4 console.log(x.k) ; //报错 x.k是读取x对象下的k属性,这里因为没有k属性所以报错,x.k的k不能读取全局变量k的值。
5 //console.log(a[0] === a.0);   //报错

另外对象定义的时候,属性名(key),也不能直接引用变量:但是属性的值可以用变量代替,比如a:a; json的属性a的值就会被赋予变量a的值="test";

比如:

1 var a = "test",
2     json={
3   "name":"jj",
4   a:"haha" //这里写的a,就是json这个对象下的属性a,并不能读到变量a,当定义对象的属性的时候,就是对象的属性,跟其他的变量无关。对象的属性其实也是这个对象的域内的变量;    
5 }

 

三、内置对象-document(html文档)

document是DOM写好的,以html_document为模型的供JS调用的对象。

对象的属性不是每条都是可见、可读、可写的,内置对象document里面就有很多不可读、不可见、不可写的属性。

1 cosnole.dir(document);

 

四、节点对象-通过获取节点对象的api获取。

每个html文件的布局和元素都不一样,所以JS不能预先知道会有什么样的节点对象而预先创建,DOM里面会提供一个节点对象的公共类,

根据html的文档元素的具体内容,在获取的时候,会去继承节点对象的公共类的基础上,根据具体内容去完善。

1 console.dir(document.getElementById("wrap"));

 

五、function函数。

为什么需要函数:在某些的特定的事件触发,或者某个特定条件下,需要去执行很大一段代码,需要统一的去管理这些代码,所以就产生了函数这个数据类型。 

函数的定义:

function对象的2种定义方式;

第一种 function hh 是一个完整的定义函数,}作为结束符,可以不用加分号。

第二种定义方式 主表达式是  var hh = .......... ,是一个变量赋值的表达式,所以 } 只能作为function函数体的结束符,无法作为 var hh = ....的结束符,所以后面要加分号;。

1 funciton hh () {
2     alert(1);    
3 }       //不用加分号。
4 
5 var hh = function (){
6     alert(1);
7 };     //需要加分号。

函数的执行:

函数的this指向只有函数执行的时候才确定,即执行函数的主体是哪个对象,this就指向谁。

1 <body>
 2     <div id="wrap"></div>
 3     <script>
 4         var xx = function () {
 5             alert(1);
 6             alert(this);  //函数的this指向只有函数执行的时候才确定
 7             };
 8         var oWrap = document.getElementById ("wrap");
 9             xx();    //  自执行的时候this指向window,严格模式下指向undefined
10             document.onclick = xx ;   ///事件触发执行函数XX时 ,this指向 object HTMLDocument
11             oWrap.onclick =xx; //事件触发执行函数XX时,this指向oWrap(object HTMLDivElement)
12     </script>
13 </body>

 

 

 

 

事件函数的理解:

事件在代码定义阶段注册,有点类似 变量的定义。 但是事件函数不会像 变量定义完就执行这样去自己执行,需要触发事件,注册的事件后面的函数体才会执行。

document.onlick 这个事件触发的时候,这个函数 就会执行,你也可以理解为 document.onlick 是一个属性,当这个属性的事件,即文档点击的时候,这个属性的函数执行document.onclick();

1 document.onclick = function () {
2       alert (1);  
3 }

注意:

匿名函数不能单独直接出现的代码里面。要么给函数定义一个函数名,要么赋值给某个变量或者属性,直接写会提示报错。

1 function(){    //会报错。
2     alert (1);
3 }

 可以通过console.dir(对象名) 查看对象属性,

1 var a = {
2       "name":"guo",
3        "age":18  
4 }
5 var  b = function (){
6        alert(1);
7 }
8 console.dir(a);
9 console.dir(b);