面向对象2

时间：2016-07-31 01:34:23 阅读：140 评论：0 收藏：0 [点我收藏+]

标签：

空对象

 var o = null;
 // 空对象, 存特点是只有变量 o 没有对象数据

值类型与引用类型的存储特征

内存逻辑结构( 画图 )
赋值
```
 var num = 123;
 var num2 = num;
```
- 值类型赋值的存储特点, 将变量内的数据全部拷贝一份, 存储给新的变量.
- var num = 123 表示变量中存储的数字是 123.
- 然后将数据拷贝一份,就是将 123 拷贝一份. 那么内存中有 2 个数组
- 将拷贝数据赋值给 num2
- 其特点是在内存中有两个数据副本.
- 练习: var o = { name: ‘张三‘ };, var obj = o;
引用类型的赋值
```
 var o = { name: ‘张三‘ };
 var obj = o;
```
- 赋值就是将变量 o 中存储的数据拷贝一份, 然后将该数据赋值给 obj
- 内存中有 1 分数据
- 问题: 利用 obj 修改的 name 属性会影响到 o 中的 name

深拷贝与浅拷贝

什么是深拷贝, 什么是浅拷贝
- 如果拷贝的时候, 将数据的所有引用结构都拷贝一份, 那么数据在内存中独立就是深拷贝
- 如果拷贝的时候, 只针对当前对象的属性进行拷贝, 而属性是引用类型这个不考虑, 那么就是浅拷贝
- 拷贝: 复制一份. 指将对象数据复制.
- 在讨论深拷与浅拷的时候一定要保证对象的属性也是引用类型.
代码的封装
- 利用面向对象的思想, 一般会让对象带有一个 copy 的方法, 来完成自己的拷贝
- 如果需要将一个对象封装成浅拷贝
- this 在函数( 方法 )内部, 表示调用该函数( 方法 )的对象.

对象的动态特性

在 js 中, 一格对象需要属性, 就可以利用 对象.属性名 = 值 的方式为其添加. 只要赋值成功, 对象就新增了属性.
对象属性的访问形式
- 点语法: o.name
- 关联数组: o[ name ]

曾经使用

function mix( obj1, obj2 ) {
 for ( var k in obj2 ) {
     obj1[ k ] = obj2[ k ];
 }
}

凡是需要给对象动态添加成员的时候, 必须使用关联数组的语法

 // 利用关联数组的语法, 访问其 name 属性, 调用其 sayHello 方法
 var o = { 
     name: ‘张三‘, 
     sayHello: function () {
         console.log( ‘你好, 我叫 ‘ + this.name );
     }
 };

 // console.log( o.name );
 console.log( o[ ‘name‘ ] );
 // o.sayHello();
 o[ ‘sayHello‘ ]();

作为参数参数

作为函数的参数, 就是将参数的数据拷贝一份传递给函数的定义中的参数
```
 function foo( num ) {}
 var a = 123;
 foo( a );
```
- 函数在调用的时候, 首先需要将参数中的数据拷贝一份. 即数字 123 拷贝一份.
- 跳转到函数的定义中( 函数体 ), 再次之前完成了参数的赋值, 即 num = 123.
- 正式的进入函数内, 准备执行函数中的每一句话.
值类型作为函数参数传递的特征, 函数内与函数外是两个不同的变量, 仅仅是值相等而已.
引用类型作为函数参数传递的特征, 函数内与函数外是两个不同的变量, 但是指向同一个对象.
- 因此在函数内部允许修改函数外部的对象的数据

构造函数的作用

构造函数是干什么用的

初始化数据的
在 js 给对象添加属性用的, 初始化属性值用

创建对象的过程

代码: var p = new Person();.
首先运算符 new 创建了一个对象. 它类似于 {}, 是一个‘没有任何成员‘的对象.
- 使用 new 创建对象, 对象的类型就是创建它的构造函数名.
- 使用 {} 无论如何都是 Object 类型, 相当于 new Object.
然后调用构造函数为其初始化成员
- 构造函数在调用的一开始, 有一个赋值操作, 即 this = 刚刚创建出来的对象.
- 因此在构造函数中 this 表示刚刚创建出来的对象.
在构造函数中利用对象的动态特性为对象添加成员.

异常

异常的概念

异常就是程序在运行过程中出现的错误.

在 js 中出现异常后, 浏览器会给出一段错误码, 就是错误消息. 错误消息由错误类型与错误信息构成

如何处理异常

就是要出现异常后还能继续执行. 异常最大的特征是一旦代码出现异常其后的代码就不再执行.

常见的异常有两大类:

运行环境的多样性
语法错误, 代码错误

try-catch 语法

即尝试这么做, 如果出现错误捕获错误

...
try {
    可能出现错误的代码
} catch( e ) {
    处理错误的代码
}
...

代码正常运行, 如果在 try 中出现了错误, try 里面出现错误的语句后面的代码都不再执行, 直接跳转到 catch 中
catch 中处理错误信息
然后继续执行后面的代码
如果 try 中没有出现错误, 那么不走 catch 直接执行后面的代码

如何抛出异常

throw 对象

throw 是抛出异常的语法, 其后跟一个对象, 即错误消息对象
一般该对象使用 new Error( ‘错误消息‘ ) 来创建. 也支持任意的对象.

function showMessage ( msg ) {
    // 要显示一段文本, 所以我做一个限制
    if ( typeof msg !== ‘string‘ ) {
        throw new Error( ‘传入的参数不是一个字符串‘ );
    }
    // 是正常的
    console.log( msg );
}

补充

try-catch 语法的最终结构是 try-catch-finally

 try {
     可能出现错误的代码
 } catch ( e ) {
     如果出现错误就执行
 } finally {
     结束 try 这个代码块之前执行, 即最后执行
 }

层级传递

 function f1 () {
     f2();                // f1 称为调用者, 或调用函数, f2 称为被调用者, 或被调用函数
 }
 function f2 () {
     f3();
 }
 function f3() {
     throw new Error( ‘error‘ );
 }
 f1();

dom 操作

绘制 DOM 树

<!doctype html>
<html>
    <head>
        <title>测试</title>
    </head>
    <body>
        <!-- 测试 -->
        <div>
            你好我是一个 <span style="color: red">div</span> 标签</div>
    </body>
</html>

任何一个 DOM 树结构的结论

所谓的 DOM 操作, 操作的是什么?

一般DOM树结构

 父节点
     兄弟节点
     当前节点
         属性节点
         子节点
     兄弟节点

面向对象2

标签：

原文地址：http://www.cnblogs.com/lcf1314/p/5722128.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行