【前端攻城师之JS基础】02JS对象基础

1.对象的基本操作/new关键字创建一个对象

1. 对象属于一种复合的数据类型，在对象中可以保存多个不同数据类型的属性，在js中除了基本类型，剩下的都是对象

2. 对象的分类

   • 内建对象：由ES标准指定好的对象，在任何ES的实现中可以直接拿来使用 例如Object ,数组，和Funtion对象
   • 宿主对象：由JS的运行环境提供的对象，
   • 目前来讲主要是指浏览器提供的对象，包括DOM（文档对象模型）和BOM(浏览器对象模型)
   • 自定义对象：由前端开发人员自己创建的对象

3. 方法一：使用new关键字创建一个对象

   使用new关键字调用的函数是构造函数，构造函数是专门用来创建对象的函数

   使用typedef 关键字检查一个对象时，会返回object

   var obj=new Object( );

4. 向对象中添加/修改属性

   在对象中保存的值称为属性

   语法 ：对象名.属性名=属性值 ; person.nam，e=“张三”；

5. 读取对象的属性

   如果读取对象中没有的属性，则会返回undefined

   语法 ：对象名.属性名

6. 删除对象的属性

   语法 ：delete 对象名.属性名

2.属性名和属性值

1. 属性名

   • 对象的属性名没有强制要求标识符的规范，什么乱七八糟的名字都可以使用

     但是我们还是尽量按照标识符的标准去定义

     person.var=“hello”;不会报错

   • 如果要使用特殊的属性名，不能采用对象.属性名的方式

     而应该使用对象[“属性名”]=属性值来使用

     person[“sf# %# %Edf”]=123；

   • 使用【】这种形式更加灵活，在【】中可以直接传递一个变量，属性就会从变量值中读取得到

2. 属性值

   js中的属性值可以是任何类型（五个基本数据类型和一个对象）

3. in运算符

   通过该运算符可以判断一个对象中是否含有指定的属性，返回值是true,或false

   语法：“属性名” in 对象名

3.基本数据类型和引用类型

1. 基本数据类型

   基本数据类型的值直接在栈内存中存储，值与值之间互相独立，修改一个变量不会影响其他的变量

2. 引用类型

   • 对象是在堆内存中存储，每创建一个新的对象，就会在堆内存中开辟出一个新的空间，而变量保存的是对象的引用（地址），如果两个变量保存的是同一个对象的引用，这两个变量会相互影响，当通过一个变量修改属性时，另一个变量也会跟着改变

   • 时刻牢记 对象赋值的变量，它本身就不是对象，而是一个存着对象地址的变量

     当从一个变量向另一个变量复制引用类型的值时，会将对象的引用复制到变量中，并不是创建一个新的对象。

3. 比较

   当比较两个基本数据类型时，就是比较值

   而比较两个引用数据类型时，它是比较对象的内存地址

4.使用字面量创建一个对象

1. 使用字面量可以在创建对象的同时直接指定对象中的属性

   语法:{属性名：属性值，属性名：属性值，属性名：属性值}

   var person={

   }

2. 对象字面量的属性名可以加引号也可以不加引号，建议不加

   如果属性名是特殊字符，则建议加上引号 比如numbers.a的属性名就要加上引号 ‘numbers.a’

3. 属性名和属性值是一组键值对，多组键值对之间用 , 分隔，如果一个属性之后没有其他属性了，则不要加 ，

4. 对象里面的属性值 仍然可以是一个对象

5.函数的简介

1. 函数也是一个对象，对象能干的事函数都能干

2. 方法一：用构造函数创建一个函数

   var fun1=fun(“console.log(“hello”)”)

   创建一个函数对象，可以将要封装的代码以字符串的形式传递给构造函数，封装好的函数不会直接执行，只有调用函数才会执行封装的代码

3. 方法一：使用函数声明来创建一个函数

   语法 function 函数名([参数1，参数2，参数N]){

   }

4. 方法三：使用函数表达式创建函数

   原理 ：创建一个匿名函数，然后将函数赋值给一个变量

   语法 ：var fun3=function([参数1，参数2，参数N]){

   }

   整个是一个赋值语句，最后要写好分号

6.函数的参数和返回值

1.实参

• 调用函数时，解析器不会检查实参的类型，所以要注意是否存在接受非法的参数的情况，要对参数进行类型的检查

• 函数的实参可以时任意的数据类型，也可以是一个对象，当我们参数过多时，可以将多个实参封装成一个对象，传给函数

• 调用函数时，解析器也不会检查实参的个数，多余的实参不会被赋值，如果实参的个数少于形参，那么没有对应实参的形参的值会被赋值成undefined

• 函数的实参也可以是函数，因为函数也是对象，这种调用方式就相当于，实参和形参是同一个函数对象，这种方式在开发中比较常见，我们通常会把一个匿名函数作为实参传递给形参

• fun( sum( ) )这种方式相当于使用函数的返回值

  fun( sum )这种方式相当于直接使用函数对象

  有括号的是返回值，没括号的是函数对象

2.返回值

• 可以使用return 来设置函数的返回值，语法:return 值，return后的值会作为函数的执行结果返回，可以定义一个变量来接受该结果
• 如果return 中不写任何值，或者没有返回值，函数会返回undefined
• return 可以返回任意数据类型的值，也可以是一个对象也就是说还能返回一个函数（因为函数本身就是一个对象）
• 函数return语句后的所有代码都不会执行

7.立即执行函数

立即执行函数 在声明的时候就会执行，而且只会执行这一次

 (function(){

​      alert("我是一个匿名函数");

​      *//给匿名函数外面加上括号，代表是一个整体的函数对象，就不会报错*

​    })();

// 例子

​    (function(a,b){

​      console.log(a);

​      console.log(b);

​    })(4,6);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

8.对象的方法

1.对象的方法

对象的属性值也可以是函数

1. 如果一个函数是一个对象的属性值，那么这个函数称为这个对象的方法，调用这个函数称为调用这个对象的方法

   obj.name="张三"

   obj.sayName=function(){

   console.log(obj.name);

   }

   obj.sayName()得到的值是张三

   SayName（）函数是obj对象的方法
1
2
3
4
5
6
7
8
9
10
11

2. obj.sayName()调方法

   fun( )调函数

2.对象的枚举

使用for in语法实现

语法 for( var 变量 in 对象){

}

 for...in  语句,对象有几个属性，循环就会执行几次，每执行一次，都会将对象的属性名赋值给变量

 for  n in obj{

  console.log( obj[ n ] ) //使用点运算符无效，obj.n返回undefined,因为obj对象中没有n这个属性名

  }
1
2
3
4
5
6
7

9.两个作用域

作用域指一个变量的作用范围

在JS中一共有两种作用域

1.全局作用域

• 直接编写在script标签里面的代码，都在全局作用域内

• 全局作用域在页面打开时创建，页面关闭时销毁

• 在全局作用域中有一个对象window,它由浏览器创建，在开发时我们可以直接使用

• 在作用域中，没有使用var关键字声明的变量都会成为全局变量

• 在全局作用域中

  所有的变量都会作为window对象的属性保存

  所有的函数都会作为window对象的方法保存

2.函数作用域

• 调用函数时，函数作用域创建，函数调用结束，函数作用域销毁

• 每调用一次函数就会创建一个新的函数作用域，多个函数作用域之间是相互独立的

• 当函数作用域操作一个变量时，会在自身作用域中寻找，如果有就直接使用，没有就向上一级作用域寻找

• 在函数中如果想要使用全局变量，可以使用window对象

• 在函数中使用var关键字声明的变量，也会在函数内部所有代码执行之前声明

• 函数声明也会在函数内部所有代码执行之前执行

• 在函数中，没有使用var关键字声明的变量都会成为全局变量

• 函数的形参相当于在函数内部声明了一个变量

3.变量的声明提前

• 使用var关键字声明的变量，会在所有代码执行之前被声明（但是不会赋值）

• 如果声明变量时不使用var关键字，则声明不会提前

4.函数的声明提前

使用函数声明语句创建的函数，会在所有代码执行之前创建，所以我们可以在此函数的声明之前调用该函数

使用函数表达式语句创建的函数，不会被提前创建，所以不能在声明前调用