Javascript 学习笔记六

1、javascript 面向对象

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript">
        //oDiv.onclick = function () {
        //    alert(this);
        //};
        window.onload = function () {
            var arr = [12, 65, 87];
            //this：当前的方法，属于谁
            //arr.show = function () {
            //    alert(this);
            //};
            arr.sssss = function () {
                alert(‘123‘);
            };
            arr.sssss();
        }
    </script>
</head>

<body>
</body>
</html>

我擦，代码竟然可以这么写

2、构造函数与原型

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript">
        //构造函数
        function Person(name, sex) {
            this.name = name;
            this.sex = sex;
        }
        //原型
        Person.prototype.showName = function () {
            alert(this.name);
        };
        Person.prototype.showSex = function () {
            alert(this.sex);
        };
        var p = new Person(‘blue‘, ‘男‘);
        p.showName();
        p.showSex();
    </script>
</head>
<body>
</body>
</html>

小注：

每个对象有差异的东东，可以放到构造函数中，通用的可以使用原型

3、原型的优先级

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript">
        Array.prototype.a = 12;
        var arr = [1, 2, 3];
        alert(arr.a);   //12
        arr.a = 5;
        alert(arr.a);   //5
        delete arr.a;
        alert(arr.a);   //12
    </script>
</head>
<body>
</body>
</html>

4、Javascript中this关键字详解

5、事件绑定

IE方式

attachEvent(事件名称, 函数)，绑定事件处理函数
detachEvent(事件名称, 函数)，解除绑定

DOM方式

addEventListener(事件名称,函数, 捕获)
removeEventListener(事件名称, 函数, 捕获)

//1.谁
//2.事件
//3.函数
function AddEvent(obj, sEvent, fn)
{
    //IE
    if(obj.attachEvent)
    {
        obj.attachEvent(‘on‘+sEvent, fn);
    }
    else
    {
        obj.addEventListener(sEvent, fn, false);
    }
}

6、绑定和this

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <meta charset="utf-8" />
    <script type="text/javascript">
        window.onload = function () {
            var oBtn = document.getElementById(‘btn1‘);
            /*oBtn.onclick=function ()
            {
                alert(this);
            };*/
            //IE    事件绑定        this->window
            /*oBtn.attachEvent(‘onclick‘, function (){
                alert(this==window);
            });*/
            //FF
            oBtn.addEventListener(‘click‘, function () {
                alert(this);
            }, false);
        };
    </script>
</head>
<body>
    <input id="btn1" type="button" value="aaa" />
</body>
</html>

7、匿名函数

匿名函数绑定事件无法解除绑定

与C #一样嘛

时间： 2024-08-24 10:43:16

Javascript 学习笔记六的相关文章

javascript学习笔记(六)

网页换肤第一步,实现网页换肤的页面布局 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http

JavaScript学习笔记【2】表达式和运算符、语句、对象

笔记来自<JavaScript权威指南(第六版)> 包含的内容: 表达式和运算符语句对象表达式和运算符数组直接量中的列表逗号之间的元素可以省略,这时省略的空位会填充值undefined.元素列表末尾可以留下单个逗号,这时并不会创建一个新的值为undefined元素. 属性访问表达式,.identifier的写法只适用于要访问的属性名称是合法的标识符,并且需要知道要访问的属性的名字.如果属性名称是一个保留字或者包含空格和标识符,或是一个数字(对于数组来说),则必须使用方括号的写法.当属性

JavaScript学习笔记【3】数组、函数、服务器端JavaScript概述

笔记来自<JavaScript权威指南(第六版)> 包含的内容: 数组函数服务器端JavaScript概述数组数组是动态的:根据需要它们会增长或缩减,并且在创建数组时无须声明一个固定的大小或在数组大小变化时无须重新分配空间. 数组可能是稀疏的:索引不一定要连续的,它们之间可以有空缺. 通常,数组的实现是经过优化的,用数字索引来访问数组元素一般来说比访问常规的对象属性要快很多. 数组继承自Array.prototype中的属性,它定义了一套丰富的数组操作方法. 如果省略数组直接量中的某个

Javascript 学习笔记 2：标识语句

可以在任何语句声明之前使用唯一标识(identifier)和冒号(:)用来标记该语句: identifier: statement 这样,你可以在程序的任何其他地方通过标识来使用这个语句.即使在语句内部也可以使用该语句的标识(例如:循环语句和条件语句).当在一个循环语句前添加一个标识,你可以在语句内部通过break 标识来退出当前循环,也可以通过continue标识来继续执行该语句.例如: mainloop: while(token != null) { // Code omitted... c

python之raw_input()（学习笔记六）

python之raw_input()(学习笔记六) 我们经常使用raw_input()读取用户的输入,如下例子所示: >>> name = raw_input('please input your name:'),截图如下: 下面简单说下,raw_input()与if搭配使用,脚本如下: #!/usr/bin/env python # -*- coding:utf-8 -*- birth = raw_input('birth:') if birth < 2000: print '0

javascript学习笔记---ECMAScript-判断变量类型

判断类型之前,先要清楚有哪些类型. (理理思路:程序由数据和方法构成,数据由简单数据和复杂数据构成) 即类型有: 数据(简单数据:boolean,string,num,undefined,null.复杂数据:object), 方法(function) 万能的typeof,神一样的方法 typeof(1);// num typeof("hello");// string typeof(false);// boolean var vFlag; typeof(vFlag);// unde

javascript学习笔记---ECMAScript语法（引用类型）

引用类型通常叫做类(class). 本教程会讨论大量的 ECMAScript 预定义引用类型. 引用类型引用类型通常叫做类(class),也就是说,遇到引用值,所处理的就是对象. 本教程会讨论大量的 ECMAScript 预定义引用类型. 从现在起,将重点讨论与已经讨论过的原始类型紧密相关的引用类型. 注意:从传统意义上来说,ECMAScript 并不真正具有类.事实上,除了说明不存在类,在 ECMA-262 中根本没有出现"类"这个词.ECMAScript 定义了"对象定

javascript学习笔记---ECMAScriptECMAScript 对象----定义类或对象

使用预定义对象只是面向对象语言的能力的一部分,它真正强大之处在于能够创建自己专用的类和对象. ECMAScript 拥有很多创建对象或类的方法. 原始的方式因为对象的属性可以在对象创建后动态定义(后绑定),类似下面的代码: var oCar = new Object; oCar.color = "blue"; oCar.doors = 4; oCar.mpg = 25; oCar.showColor = function() { alert(this.color); };不过这里有一

javascript学习笔记---ECMAScriptECMAScript 对象----修改对象

通过使用 ECMAScript,不仅可以创建对象,还可以修改已有对象的行为. prototype 属性不仅可以定义构造函数的属性和方法,还可以为本地对象添加属性和方法. 创建新方法通过已有的方法创建新方法Number.prototype.toHexString = function() { return this.toString(16); }; 在此环境中,关键字 this 指向 Number 的实例,因此可完全访问 Number 的所有方法.有了这段代码,可实现下面的操作: var iNu

Javascript 学习 笔记六

Javascript 学习 笔记六的相关文章

Javascript 学习笔记六

Javascript 学习笔记六的相关文章