2017-03-23面向对象预习笔记

javascript 的组成

• javascript 的组成部分：
• DOM : Document Object Mode 文档对象模型，此处的文档指的是 HTML 页面（HTML 文档）
  为我们提供了一套操作页面元素的 api (一套工具)
  api:application(应用) programming(编程) interface(接口)
• BOM： Browser Object Mode 浏览器对象模型，提供一个和浏览器交互的对象，核心对象： window
• ECMAScript：规定语法的标准

基本类型和复杂类型

• 两种数据类型
• 基本（简单）数据类型
• string 字符串类型
• number 数值（小数和整数）
• boolean 布尔类型（true | false）
• null 空类型
• undefined 未定义
• 复杂（复合）数据类型
• Object 对象类型
• Array 数组类型 =====>Object
• Date 日期类型 =====>Object
• Math 数学类型 =====>Object
• Function 函数 =====>function(并非Object)
• RegExp 正则表达式
• String 字符串对象类型
• Number 数值对象类型
• Boolean 布尔对象类型
• 判断对象类型的方法
• 关键字 typeof
• 语法 typeof 变量

 var str = "demoString";
    console.log(typeof str);
    var number = 10;
    console.log(typeof number);

    console.log(typeof null);                   //Object
    console.log(null instanceof Object);        //true |false(错误的)

    var obj = {};
    if (typeof obj == "object")
    {
        console.log("有值");
    }

    var a;
    //if (a == undefined)
    if (typeof a == "undefined")
    {
      console.log(a);
    }

等于和全等于符号说明

• 赋值操作 （=）
• 等于符号 （==）
• 作用：用来判断左边的值和右边的值是否相等
• 特点：判断是否相等
• 全等符号（===）
  特点：判断值是否相等，以及类型是否相等
• 不等于符号（!=）
• 不全等于符号 （!=）

null 和 undefined 的区别
变量的值永远都不可能等于 null ,除非我们手动赋值 null
设置变量为 null 是告诉系统这个变量不再使用，可以把占用的内存空间释放

值类型和引用类型

• 值类型

• string

• number

• boolean

• undefined

• null (*)

• 引用类型

• Object 类型，以下类型其本质基本都是 Object 类型

• Function function======>object

• Array

• Date

• String

• Number

• Boolean

• 变量在内存中存储的结构，和超市储存箱很像，有一个名字（比如说01,02,03）还有一个空间（可以存放数据）

• 区别： 区别在于空间中存储的信息

• 值类型：存储的是具体数据

• 引用类型：存储的是一个引用 (reference)[地址]，该引用指向内存的一块存储空间，这块空间存储着具体数据

• 举例：
  01（变量的名称） ------> 一个苹果（具体数据）
  02（变量的名称） ------>苹果在超市的第二排货架的第一列（地址）

值类型和引用类型的赋值

• 赋值（=）：
  左边的变量 = 右边的变量；
  var a = 10;
  内部细节：是把右边变量（空间中）存储的值赋值一份放在左边变量开辟的存储空间中
• 值类型的赋值
  赋值操作：是把右边变量（空间中）存储的值[具体数据]复制一份放在左边变量(空间中)修改了其中的一个变量对另一个变量没有影响
• 引用类型的赋值
  赋值操作：是把右边变量（空间中）存储值的[地址]赋值一份放在左边变量（空间中），修改了其中一个对象，对另外一个对象是有影响的

var str1 = '让我掉下眼泪的，不止作业的酒';
var str2 = str1 ;
console.log(str1  == str2);//true
//修改变量的值
str1 = '让我依依不舍的，不止你的温柔'
console.log(str1);
console.log(str2);
var obj1 = {name:'zs'};
var obj2 = obj1;
obj1.name = 'lisi';
console.log(obj2.name);  //lisi
//该行代码切断 obj2和obj1 的联系
obj1 = {age:22};  
console.log(obj2.age);  
//输出 undefined

值类型和引用类型在函数中的使用

• 在函数中的使用
  函数的参数：
  形参（形式参数）：该变量使用来占位用的，在调用之前是没有值的，在函数内部表现为一个局部变量（param）
  实参：函数调用的时候传入的参数，这个参数是有值的（a）;

• 函数的调用
  把实参的值赋值给形参
  值类型作为函数的参数：那么内部修改了参数的值，对外部的实参没有影响
  引用类型数据作为函数的参数：那么内部修改了形参的值，对外部的实参有影响，他们只想的是内存中的同一块数据

<script>
function func(param){
        console.log(param);//我是字符串
        param = '我也是一个字符串';
        console.log(param);
}
var a = '我是字符串';
func(a);
console.log(a);
</script>
<script>
function foo(obj){
        console.log(obj.name);//zhangsan
//尝试修改形参的值
//obj.name = 'lisi';
obj = {
          name:'哗啦哗啦';
        }
obj.name = 'lisi';
}
var o = {name:'zhangsan'};
foo(o);
console.log(o.name,'_____');
</script>

//此处例子并未显示出引用类型赋值在函数内部如果改变的话，会对函数外部造成影响 ？？？

对象的动态特性

• javaScript 中的对象和其他的大多数语言都不一样
• 对象支持动态特性：增删改查（方法）
• 对象：键值对的集合（key - value）
• 属性：在对象内部声明的变量
• 方法：在对象内部定义的函数
  -操作对象的属性和方法可以使用两套方式
• 点语法
• 中括号

//点语法使用
//创建要给空的对象
var obj = {};
//动态添加属性
obj.name = 'zhangsan';
console.log(obj.name);
//修改属性
obj.name = 'lisi';
console.log(obj.name);
//区分添加还是修改:在通过点语法的方式访问属性的时候，先检查该属性是否存在，如果存在就是修改，如果该属性不存在，那么就是添加
//添加方法
obj.showName = function(){
          console.log('我的名字');
}
obj.showName();
//修改方法
obj.showName = function(){
        console.log('哈哈哈哈')；
}
obj.showName();
//输出对象的属性
//关键字 delete
//语法：delete  对象.属性
delete obj.name;
console.log(obj.name);

//中括号语法[]
var obj = {};
var name = 'testName';
//注意在使用[]语法的时候，key 必须是字符串需要加""
obj[name] = 'zhangsan';
//name 是 window 的name
console.log(obj);
obj["name"] = "lisi";
console.log(obj["name"]);
//添加方法
obj['showName'] = function(){
        console.log('我的名字');
} 
obj['showName']();
//修改方法
obj['showName'] = function(){
        console.log('哈哈哈哈----');
}
obj['showName']();
//删除对象的属性
delete obj['name'];
console.log(obj['name']);  //undefined
obj['background color'] = 'red';
console.log(obj);