js面向对象--基础知识（1）

面向对象(Object Oriented,OO)是当前计算机界关心的重点，它是90年代软件开发方法的主流。面向对象的概念和应用已超越了程序设计和软件开发，扩展到很宽的范围。如数据库系统、交互式界面、应用结构、应用平台、分布式系统、网络管理结构、CAD技术、人工智能等领域。
　　从世界观的角度可以认为：
　　1、面向对象的基本哲学是认为世界是由各种各样具有自己的运动规律和内部状态的对象所组成的；
　　2、不同对象之间的相互作用和通讯构成了完整的现实世界。
　　因此，人们应当按照现实世界这个本来面貌来理解世界，直接通过对象及其相互关系来反映世界。这样建立起来的系统才能符合现实世界的本来面目。
　　从方法学的角度可以认为：
　　1、面向对象的方法是面向对象的世界观在开发方法中的直接运用；
　　2、它强调系统的结构应该直接与现实世界的结构相对应，应该围绕现实世界中的对象来构造系统，而不是围绕功能来构造系统。

总的来说,面向对象就是对面向过程的一种封装,只不过面向对象更看重的是结果而不关注过程是什么样子的!

---

JavaScript三个组成部分:

• DOM:Document Object Model 文档对象模型
  DOM树,本身为我们操作页面提供了一套方法(API),API即application programming interface,应用程序编程接口
• BOM:Browser Object Model 浏览器对象模型
  核心对象(window location)
• ECMAScript:规定了js的语法规则,js语句,关键字,保留字

基本类型和复杂类型:

• 基本数据类型(简单数据类型)
  string 字符串类型
  number 数值
  boolean 布尔类型
  undefine 未定义
  null 空(对象)

• 复杂数据类型
  Object 对象类型
  Array 数组类型
  Date 日期类型
  Function 函数类型
  String
  Number
  Boolean

注意:复杂数据类型中的String、Number、Boolean是JS中的内置函数

如何判断数据的数据类型：typeof 关键字，返回值是string类型

var a = "字符串";
    console.log(typeof (typeof a));  //string
    var b = 10;
    console.log(typeof b); //number
    var c = true;
    console.log(typeof c);//boolean

    var d = null;
    console.log(typeof d);//object

    var arr = [1,2,3];
    console.log(typeof arr);//array or object
    //结论:复杂数据在使用typeof操作的时候,打印出来的结果都是object ,除了函数
    console.log(typeof function funcName() {

    }); //Function

    //01 变量的值会为null吗
    //变量的值不可能为null,除非我们手动的赋值为null
    var test;
    console.log(test); //undefined
    test = null;

    //02 什么时候要设置为null
    //我们需要解除引用的时候

赋值运算符

等于符号(==)
比较的时候只判断数值是否是相等的
全等符号(===)
比较的时候不仅要比较数据还需要比较类型
不等于(!=)
不全等于(!==)

var str1 = "让我掉下眼泪的,不止你的温柔";
    var str2 = "让我掉下眼泪的,不止你的温柔";
    console.log(str1 == str2);

    var test1 = 1;
    var test2 = "1";
    console.log(test1 == test2);    //true
    console.log(test1 === test2);  //false

    //数组是引用(地址)类型,存储的是指向具体数据的地址(引用)
    var arr1 = [1,2,3]; //0x11
    var arr2 = [1,2,3]; //0x22
    console.log(arr1 == arr2);  //true or (false)

关系运算符

返回值:布尔类型,要么是true要么是false
大于 >
小于 <
大于等于 >=
小于等于 <=

逻辑运算符

逻辑非(!) 取反
逻辑或(||)
语法:表达式1 || 表达式2
结果:
判断表达式1,如果表达式1为真,那么就返回表达式
如果表达式1的值为假,那么就返回表达式2

    var resultA = 3 || 2;   //3
    var resultB = 0 || 2;   //2
    var resultC = 5 || 0;   //5
    var resultD = 0 || 0;   //0

逻辑与(&&)
语法:表达式1 && 表达式2
结果:
如果表达式1为真,返回表达式2
如果表达式1为假,返回表达式1

    var resultA = 3 && 2;   //2
    var resultB = 0 && 2;   //0
    var resultC = 5 && 0;   //0
    var resultD = 0 || 0;   //0

值类型和引用类型

• 值类型
  string
  number
  boolean
  undefine
• 引用类型
  object类型
  值类型：存储的是具体的值
  引用类型：存储的是只想具体值的地址

重点：赋值(=):把右边的数据复制一份给左边
值类型赋值:
1.把右边变量存储存储的值(具体的数据)复制一份给左边的变量
2.值类型的赋值:是简单数据的复制,他们保存在相对独立的空间中,彼此不会影响

引用类型:
1. 把右边变量存储存储的值(指向具体数据的地址)复制一份给左边的变量
2.引用类型赋值:修改了某个对象的属性,对另外一个对象的属性会有影响

    var str1 = "烟雨蒙蒙";
    var str2 = str1;
    str1 = "晴空万里";
    console.log(str1);//晴空万里
    console.log(str2);//烟雨蒙蒙

    var obj1 = {
        name:"张老汉"
    }
    var obj2 = obj1;
    obj1.name = "老王";
    console.log(obj1.name);//老王"
    console.log(obj2.name);//老王"

函数里面的相关术语

• 实参(实际参数):
• 形参(形式参数):占用的变量,没有调用函数的时候形参是没有值
  函数的调用:默认会把实参的值赋值给形参

值类型作为函数的参数:

• 实参和形参他们的数据是相互独立的
  引用类型作为函数的参数
• 形参和实参共享同一份数据,修改其中的某个对象对另外一个对象也会有影响

对象的动态特性

已经定义好的对象,我们可以动态的来进行操作:增加|删除|修改
访问对象有两种形式:

• 点语法
• [ ] 方括号语法

//01 创建对象
    var obj ={};
    //02 动态的为已经创建的对象添加属性
    obj.name = "黄小华";
    console.log(obj.name);

    //03 添加方法
    obj.sayHello = function () {
        console.log("hello");
    };

    obj.sayHello();

    //04 修改已经存在对象的属性值
    obj.name = "黄日华";
    //小结:在使用点语法设置对象的属性的时候,如果对象中不存在改属性,就是增加操作
    //如果对象中已经存在改属性,那么就是修改操作

    //05 删除对象中属性
    console.log(obj.name);
    delete obj.name;
    console.log(obj.name);  //null or (undefined)

    //01 创建对象
    var obj ={};
    //02 动态的为已经创建的对象添加属性
    //对象:键-值(key-value)对的集合
    //注意点:在使用[]语法的时候,键应该使用双引用
    obj["name"] = "黄小华";
    console.log(obj.name);

    //再增加一个属性
    obj["background color"] = "黑色";
    console.log(obj["background color"]);

    //03 添加方法
    obj["sayHello"] = function () {
        console.log("hello======");
    };

    obj["sayHello"](); //不推荐这样写

    //04 修改已经存在对象的属性值
    obj["name"] = "黄日华";
    //小结:在使用点语法设置对象的属性的时候,如果对象中不存在改属性,就是增加操作
    //如果对象中已经存在改属性,那么就是修改操作

    //05 删除对象中属性
    console.log(obj.name);
    delete obj["name"];
    console.log(obj.name);  //null or (undefined)


    //创建对象
    var date = new Date();
    var o = new Object();
    console.log(date);
    //GMT 格林尼治时间

in关键字用法

• 遍历对象

    var obj = {
        name:"苹果",
        color:"黑苹果"
    };
    for(var key in obj) {
        console.log(key, obj[key]);
    }

• 查找某对象中是否有某属性

//注意点:在使用in关键字的时候,key是字符串,需要加上双引号
    var isInclude = "name" in obj;
    console.log(isInclude) ;

delete关键字

delete 关键字的用法
01 删除对象中的实例属性
02 删除未使用var声明的变量
delete 使用的注意点
01 它是有返回值的,它的值是布尔类型
02 不能删除var 声明的变量
03 可以删除直接定义在window上面的属性,但是无法删除全局变量(var)

//01 删除对象中的实例属
    var obj = {
        name:"小黄",
        color:"黄色"
    };

    console.log(delete obj.age);  //返回值 true
    console.log(obj.color);
    console.log(delete obj.color);;
    console.log(obj.color); //null or (undefined)

    // 02 删除未使用var声明的变量
    //没有使用var关键字声明的变量是全局变量,自动成为window的属性
    test = "这是一个没有使用var关键字声明的变量";
    console.log(test);

    delete test;
    //console.log(test);  //报错
    console.log(window.test); //undefined

    //03 能够删除使用var关键字声明的变量吗? 不能
    var testVar = "使用var声明的变量";
    console.log(delete testVar); //false
    console.log(testVar);   //使用var声明的变量

    //能够删除成功
    window.nameDemo = "demo";
    console.log(window.nameDemo);   //demo
    delete window.nameDemo;
    console.log(window.nameDemo);

    //无法删除成功
    var demo = "demo------";

end

javaScript之面向对象初级二

聪明出于勤奋，天才在于积累。——华罗庚