标签:
**对象基础**
1.什么是对象
对象是一组无序的原始数据类型,并且这个序列以键值对的形式储存.序列中的每一项被称之为属性(函数称之为方法),并且每个属性姓名必须是唯一的。
属性名可以是字符串和数字,但是如果属性名是数字,它就括号必须用方括号来取值
var ageGroup = {
30:"children",
100:"very old"
};
console.log(ageGroup.30);// 报错
console.log(ageGroup["30"]);// 正确
2.引用数据类型和原始数据类型
引用数据类型和原始数据类型之间的主要区别之一在于引用数据类型的值是引用的形式储存的,而不是像原始数据那种以值的形式直接将值储存到变量里。
原始数据类型
var person=“Kobe”;
var otherPerson=person;
person=“Bryant”;
console.log(person);
console.log(otherPerson);
引用数据类型:
在引用数据类型中 ,存放的实际上是一个地址值而非一个真正的值 , 它指向的是这个对象属性所在的内存空间
3.对象数据属性所具有的特性
每个数据属性除了具有键值对的特性外,还有其他三个属性
可配置性Configurable:指明该属性是否可以被删除
枚举性 (enumerable): 指明该属性是否能在 for/in 中被返回
可写性 (writable): 指明该属性能否被修改
4.创建对象
对象式:最普通也是最简单的一种创建方式。也可称之为JSON式对象
函数式
1.普通函数:这种构造方式是通过return关键字来获取到对象 ; 该方式也称之为 工厂方法
方式一:直接返回JSON式对象
方式二:使用Oberct对象构建
2.构造函数:构造函数实际上也是函数的一种表现形式 , 它的功能是通过new关键字调用构造函数获得一个新的对象 ( new关键字会隐式return
方式一:先声明后定义,首先创建对象,对象创建完成后给对象的属性赋值
方式二 : 声明时定义 , 在创建对象的同时给对象的属性赋值
构造函数 : 函数名第一个字母大写 , 用于区分普通函数
**正则表达式**
正则表达式 (Regular Expression) 又称作正规表达式或常规表示法, 它使用单个字符串来描述 , 匹配一系列符合某个句法规则的字符串 . 通常使用正则表达式来检索或替换那些符合某个模式的文本
一.命令
bracket括号
方括号[]:需要匹配的字符;
花括号{}:需要匹配的数量;
圆括号():用来进行的规则的分组
Caret ^插入符号 : 表示正则表达式的开始
Dollars $美元符号 : 表示正则表达式的结束
1.常用命令
* 匹配前面的子表达式零次或多次;
+ 匹配前面的子表达式一次或多次;
? 匹配前面的子表达式零次或一次;
\d 匹配一个数字字符,等价于 [0-9];
\D 等价于 [^0-9]
\w 英文 , 数字 , 下划线 , 等价于 [a-z0-9_]
\W 等价于 [^a-z0-0_]
\s 空格
\S 非空格
二.匹配规则
1.字面量字符和元字符
大部分字符在正则表达式中,就是字面的含义,/dog/就表示"d""o""g"三个字母连接在一起
位置字符:
^表示字符串的开始位置
$表示字符串的结束位置
竖线符号( | )在正则表达式中表示 “ 或关系 ” ( OR ),即 cat|dog 表示匹配 cat 或 dog
多个选择器可以联合使用
/a( |\t)b/.test(‘a\tb‘) // true “a” 和 “b” 之间有一个空格或者一个制表符。
2.重复类
模式的精确匹配次数,使用大括号( {} )表示。 {n} 表示恰好重复 n 次, {n,} 表示至少重复 n 次, {n,m} 表示重复不少于 n 次,不多于 m 次。
三。量词符
? 问号表示某个模式出现 0 次或 1 次,等同于 {0, 1} 。
* 星号表示某个模式出现 0 次或多次,等同于 {0,} 。
+ 加号表示某个模式出现 1 次或多次,等同于 {1,} 。
四.贪婪模式
量词符,默认情况下都是最大可能匹配,即匹配直到下一个字符不满足匹配规则为止。这被称为贪婪模式。
1.var s = ‘aaa‘;
s.match(/a+/) // ["aaa"]
模式是 /a+/ ,表示匹配 1 个 a 或多个 a ,那么到底会匹配几个 a 呢?因为默认是贪婪模式,会一直匹配到字符 a 不出现为止,所以匹配结果是 3 个 a
2.var s = ‘aaa‘;
s.match(/a+?/) // ["a"]
模式结尾添加了一个问号 /a+?/ ,这时就改为非贪婪模式,一旦条件满足,就不再往下匹配。
*? :表示某个模式出现 0 次或多次,匹配时采用非贪婪模式。
+? :表示某个模式出现 1 次或多次,匹配时采用非贪婪模式
五.字符类
字符类( class )表示有一系列字符可供选择,只要匹配其中一个就可以了。
/[abc]/.test(‘apple‘) // true
字符串 “hello world” 不包含 a 、 b 、 c 这三个字母中的任一个,而字符串 “apple” 包含字母 a 。
( 1 ):脱字符( ^ )
方括号内的第一个字符是 [^] ,则表示除了字符类之中的字符,其他字符都可以匹配。比如, [^xyz] 表示除了 x 、 y 、 z 之外都可以匹配。
( 2 )连字符( - )
某些情况下,对于连续序列的字符,连字符( - )用来提供简写形式,表示字符的连续范围。比如, [abc] 可以写成 [a-c] , [0123456789] 可以写成 [0-9] ,
同理 [A-Z] 表示 26 个大写字母。
当连字号( dash )不出现在方括号之中,就不具备简写的作用,只代表字面的含义,所以不匹配字符 b 。只有当连字号用在方括号之中,才表示连续的字符序列。
六。转移符
正则表达式中那些有特殊含义的字符,如果要匹配它们本身,就需要在它们前面要加上反斜杠。比如要匹配加号,就要写成 \+ 。
/1+1/.test(‘1+1‘)
// false
/1\+1/.test(‘1+1‘)
// true
第一个正则表达式直接用加号匹配,结果加号解释成量词,导致不匹配。第二个正则表达式使用反斜杠对加号转义,就能匹配成功。
七.修饰符
修饰符( modifier )表示模式的附加规则,放在正则模式的最尾部。
修饰符可以单个使用,也可以多个一起使用。
(1)g修饰符
默认情况下,第一次匹配成功后,正则对象就停止向下匹配了。 g 修饰符表示全局匹配( global ),加上它以后,正则对象将匹配全部符合条件的结果,主要用于搜索和替换
( 2 ) i 修饰符
默认情况下,正则对象区分字母的大小写,加上 i 修饰符以后表示忽略大小写
/abc/.test(‘ABC‘) // false
/abc/i.test(‘ABC‘) // true
上面代码表示,加了 i 修饰符以后,不考虑大小写,所以模式 abc 匹配字符串 ABC
八。预定义模式
\d 匹配 0-9 之间的任一数字,相当于 [0-9] 。
\D 匹配所有 0-9 以外的字符,相当于 [^0-9] 。
\w 匹配任意的字母、数字和下划线,相当于 [A-Za-z0-9] 。
\W 除所有字母、数字和下划线以外的字符,相当于 [^A-Za-z0-9] 。
\s 匹配空格(包括制表符、空格符、断行符等),相等于 [\t\r\n\v\f] 。
\S 匹配非空格的字符,相当于 [^\t\r\n\v\f] 。
\b 匹配词的边界。
\B 匹配非词边界,即在词的内部。
九。正则的属性和方法
lastIndex :返回下一次开始搜索的位置。该属性可读写,但是只在设置了 g 修饰符时有意义。\
source :返回正则表达式的字符串形式(不包括反斜杠),该属性只读。
test(): 正则对象的 test 方法返回一个布尔值,表示当前模式是否能匹配参数字符串。如果正则表达式带有 g 修饰符,则每一次 test 方法都从上一次结束的位置开始向后匹配。
exec(): 正则对象的 exec 方法,可以返回匹配结果。如果发现匹配,就返回一个数组,每个匹配成功的子字符串,就是数组成员,否则返回 null 。
属性 :
input :整个原字符串。
index :整个模式匹配成功的开始位置(从 0 开始)。
10. 字符串对象的方法
1. match() :返回一个数组,成员是所有匹配的子字符串。一般带g用
2. search() :按照给定的正则表达式进行搜索,返回一个整数,表示匹配开始的位置。字符串对象的 search 方法,返回第一个满足条件的匹配结果在整个字符串中的位置。如果没有任何匹配,则返回 -1 。
3. replace() :按照给定的正则表达式进行替换,返回替换后的字符串。字符串对象的 replace 方法可以替换匹配的值。它接受两个参数,第一个是搜索模式,第二个是替换的内容。
4. 搜索模式如果不加 g 修饰符,就替换第一个匹配成功的值,否则替换所有匹配成功的值
**EVENT**
一。事件驱动要素
1.事件源
触发事件的元素
2.事件
鼠标点击之类
3.事件处理函数
事件发生时要进行的造作叫“事件句柄”或者“事件监听器”
二。事件分类
鼠标事件
键盘事件
表单事件
页面事件
三。事件绑定
1。JavaScript脚本中绑定事件
2。标签中绑定的事件
3。监听器
IE
element.attachEvent(event, function);// 添加
element.detachEvent(event, function);// 删除
CHROM,FIREFOX
element.addEventListener(event, function, useCapture);// 添加
element.removeEventListener(event, function, useCapture);// 删除
四。事件源对象
事件源对象是指event对象,其封装了与事件相关的详细信息
。当事件发生时只能在事件函数内部访问对象
。处理函数结束后自动销毁
获取event对象
var ev=e||window.event
鼠标事件
相对于浏览器位置
event.clientX: 返回当事件被触发时鼠标指针向对于浏览器页面(或客户区)的水平坐标
event.clientY: 返回当事件被触发时鼠标指针向对于浏览器页面(客户区)的垂直坐标
相对于屏幕位置
event.screenX: 返回事件发生时鼠标指针相对于屏幕的水平坐标
event.screenY: 返回事件发生时鼠标指针相对于屏幕的垂直坐标
相对于事件源位置
event.offsetX: 返回事件发生时鼠标指针相对于事件源的水平坐标
event.offsetY: 返回事件发生时鼠标指针相对于事件源的垂直坐标
event.layerX: 返回事件发生时鼠标指针相对于事件源的水平坐标 (FIREFOX)
event.layerY: 返回事件发生时鼠标指针相对于事件源的垂直坐标 (FIREFOX
键盘属性
keyCode: 获取按下的键盘按键的值的字符代码
altKey: 指示在指定的事件发生时, Alt 键是否被按下
ctrlKey: 指示当事件发生时, Ctrl 键是否被按下
shiftKey: 指示当事件发生时, ”SHIFT” 键是否被按下
type属性用来检测事件类型
ev.type==(click)
事件流
当页面元素触发事件的时候 , 该元素的容器以及整个页面都会按照特定的顺序响应该元素的触发事件 , 事件传播的顺序叫做事件流
分类
1、冒泡型事件
element.addEventListener(event, function, false);// 冒泡型
2、捕获型事件
element.addEventListener(event, function, true);// 捕获型
dom标准的事件模型
DOM 标准同时支持两种事件模型,即捕获型事件与冒泡型事件,但是,捕获型事件先发生。两种事件流都会触发 DOM 中的所有对象
阻止事件流
IE: event.cancelBubble = true;
FF: event.stopPropagation();
目标事件源
IE: srcElement
FF: target
返回触发此事件的元素(事件的目标节点)。
阻止默认事件
event.preventDefault();
**prototype原型**
一。函数与对象的关系
1.函数就是对象的一种,可以通过instanceof运算符可以判断
2.对象是函数创建的
说明:对象是函数创建的,而函数却又是一种对象
二。prototype原型(函数)
prototype是函数的一个属性,也就是说每个函数都有一个prototype的属性,而这个prototype的属性的值实际上是一个对象,这个对象默认只有一个constructor的属性,且指向这个函数本身。
三。构造函数中得属性和原型中得属性区别
1.把属性定义在原型中比定义在构造函数中消耗的内存更小 , 因为在内存中一个类的原型只有一个 , 写在原型中的行为可以被所有实例共享 , 实例化的时候并不会再内存中再复制一份 . 因此 , 如果没有特殊原因 , 我们一般把属性写到类中 , 而 行为 写到原型中。
说明 : 使用原型的方式定义属性 , 实际上不同对象中的属性是共享的 , 也就是说 , 对其中任何一个对象修改了其中的属性值 , 其他对象的属性也会发生变化 , 因为他们共享的是同一个属性
2. 构造函数中定义的属性或方法要比在原型中定义的属性和方法的优先级高 , 如果定义了同名称的属性和方法 , 构造函数中的将会覆盖原型中的
四。隐式原型
隐式原型 : __proto__是对象的一个属性 , 即 每个对象都有一个__proto__ 属性 , 也称为隐式原型
对象的__proto__属性和函数的prototype结果一样 , obj.__proto__===Object.prototype为 true, 即 , 每个对象都有一个__proto__属性 , 指向创建该对象的函数的prototype
说明 :
1. 自定义函数本质上都是通过 Object 函数来创建的 , 所以它的__proto__指向的Object.prototype
2. Object.prototype的__proto__指向null
说明 :
函数是被 Function 创建根据对象的__proto__属性指向的是创建它的函数的 prototype, 因此Object.__proto__ === Function.prototype
说明 :
Function是一个函数 , 函数又是一种对象 , 当然也有__proto__属性 . 既然是函数 , 那么它一定是被Function创建 , 所以 , Function是被自身创建的 , 所以它的__proto__指向了自身的prototype
说明 :
Function.prototype 指向的对象是被 Object 创建的对象 , 它的__proto__指向Object.prototype
五。原型链
访问一个对象的属性时 , 先在基本属性中查找 , 如果没有 , 沿着__proto__这条链向上找 , 这就是原型链
**继承**
1.对象冒充
让父类的构造函数成为子类的方法,然后调用该子类的方法,通过this关键字给所有的属性和方法赋值。
2.原型链的方式
原理:使子类原型对象指向父类的实例以实现继承,即重写类的原型
3.call和apply方法
原理:改变函数内部的函数上下文this,使它指向传入函数的具体对象
4.混合方式
原理:混合call和原型链
标签:
原文地址:http://www.cnblogs.com/ai6962204/p/5453608.html