第十五天H5进阶

来源:互联网 发布:js淘宝购物车的实现 编辑:程序博客网 时间:2024/06/07 15:40

原型(prototype)

- 每一个函数在创建完成之后,都会默认添加一个prototype属性,    这个属性指向的是一个对象,这个对象就是我们所说的原型对象。    当函数作为一个普通的函数调用,它没有任何作用,它只会在作为构造函数调用时才会起作用!- 当函数作为构造函数使用时,每次使用该函数创建的对象中,    都会有一个隐含的属性去指向prototype属性对应的对象。          也就是说所有的通过相同的构造函数创建的对象,都有一个共同的原型对象。- 当我们去调用一个对象的方法或读取属性时,它会先去对象自身中寻找,    如果自身中没有,则向原型中寻找,如果原型中也没有,则上原型的原型中寻找,        以此类推,当找到Object对象的原型时,便不再寻找,因为Object对象的原型没有原型。- Object对象的原型没有原型对象,它是我们所有的对象的祖先。- 当前对象的原型,原型的原型,等等等这一系列的原型对象就构成我们当前对象的原型链,    当从对象中读取属性或调用方法时,会沿着原型链查找,如果找到则返回并停止查找,如果没找到则返回undefined。- 一般情况下同一个类型的对象他们的原型对象只有一个,    所以我们可以将一类对象中共有的属性和方法统一设置到原型对象中        这样所有的该类的实例都可以访问这些属性并使用这些方法。-每一个对象都有一个hasOwnProperty这个方法,可以用来检查对象中是否保存指定的属性    但是只会检查对象本身,而不会检查原型例子:    function Person(name , age){        this.name = name;        this.age = age;    }    Person.prototype.sayHello = function(){};- 原型的设置:    语法:        - 读取原型:            构造函数.prototype            对象.__proto__  //这个不是所有的浏览器都支持的,它也不是ES标准中定义的内容。        - 向原型对象中添加属性或方法            构造函数.prototype.属性名 = 属性值            构造函数.prototype.方法名 = function(){}        - 直接修改原型对象            构造函数.prototype = 新的对象-原型的作用,可以将所有的对象中共有的属性和方法,统一设置到原型对象中,这样就不用再每个对象中都分别定义  而是直接使用即可,而且也不会污染全局作用域。而且如果对象有特殊的需求,可以自己定义相关的方法和属性,  这样便不会使用原型中的方法和属性

数组(Array)

- 数组也是一个对象,主要用来保存元素。- 数组实际上和普通对象类似,只不过数组使用索引作为属性名- 索引(index),是从0开始的整数值。- 我们开发时经常会使用数组来保存一组数据,数组比普通对象存取效率要高一些。- 数组的操作:    - 创建数组:        第一种:var arr = new Array();        第二种: var arr = [];    - 向数组中添加元素        arr[index] = 值;    - 获取数组的长度        数组对象.length        - 数组的length属性实际上是数组最大的索引值+1        - 可以通过如下方式,向数组的最后边添加一个元素            数组对象[数组对象.length] = 值;    - 还可以在数组创建时执行添加元素        var arr = [元素1,元素2,元素3,元素4,元素5];    - 在JS中数组的长度基本上是没有限制的,可以放任意多的元素,        而且数组中的元素没有类型的闲置,可以是一个基本数据类型,也可以是一个对象、函数            甚至可以是一个数组,当数组中放的还是数组时,这个数组我们称为一个二维数组。    - 遍历数组:        - 遍历数组就是将数组中的所有的元素都获取出来。        - 遍历数组我们主要使用for循环来遍历:            - 例子:                for(var i=0 ; i<数组.length ; i++ ){                    console.log(数组[i]);                }        - ES5标准中还提供一个forEach()函数专门用来遍历数组的,但是注意IE8及以下的浏览器不支持该方法。        - forEach()这个方法由数组对象调用,要遍历那个对象就调用哪个对象的forEach,forEach中需要一个函数作为参数            这个函数由我们来定义,但是由浏览器去调用,这中函数称为回调函数,                数组中每有一个元素,回调函数就会被调用一次,每次浏览器都会通过函数的参数的形式将信息返回。                第一个参数:表示当前遍历到的元素的值                第二个参数:表示当前遍历到的元素的索引                第三个参数:表示数组对象本身        - 例子:            数组对象.forEach(function(value , index , obj){            });

数组方法

- 方法:    - push() --> 向数组的末尾添加一个新的元素,返回新的数组长度    - pop() --> 删除数组末尾的一个元素,并返回删除的元素    - unshift() --> 向数组的最前边添加一个新的元素,并返回新的数组的长度    - shift() --> 删除数组中第一个元素,并返回删除的元素    - slice() --> 截取数组中指定的元素        - 用法:            该方法需要两个参数:                第一个参数:开始截取位置的索引                第二个参数:截取结束位置的索引,这个参数可以是一个负值,如果是负值则从数组的后边开始计算                    第二个参数可以省略,如果省略会截取开始位置以后所有的内容        - 注意:            slice()方法不会改变原数组,而是将截取的数组作为返回值返回    - splice() --> 删除数组中的指定元素,或添加新的元素        - 用法:            该方法至少需要两个参数:                第一个参数:开始删除位置的索引                第二个参数:删除的个数                剩下的参数:                    数量不限,可以将一些新的元素添加到数组中        - 注意:splice()会修改原数组,并且会将删除元素作为返回值返回    - concat() --> 用来连接多个数组        - 用法:            数组对象.concat(元素,数组,数组);            不会改变原数组,而是返回一个新的数组    - reverse() --> 反转数组        - 用法:            数组对象.reverse()            调用完了以后会直接修改原数组,将原数组中的元素位置颠倒。    - join() --> 将数组中元素转换为一个字符串        - 用法:        -             数组对象.join("连接符")            它会将数组中所有的元素拼接为一个字符串,并使用指定的连接符连接,如果不指定连接符,则默认使用,    - sort() --> 对数组中的内容进行重新排序        - 用法:            数组对象.sort(回调函数)             - sort会影响原数组,会改变原数组的顺序,如果不传递参数,则数组中元素会按照字符编码进行排序。             - 我们可以传递进一个回调函数来指定排序规则,                回调函数只需要两个形参,浏览器会分别使用数组中的元素作为实参来调用函数,                    并且根据函数的返回值,来决定是否交换两个元素的位置,                        如果返回值大于0则交换位置,如果返回值小于等于0则不交换位置             - 升序的回调函数                function(a,b){                    return a-b;                }            - 降序的回调函数                function(a,b){                    return b-a;                }

Math

- Math这个对象不是一个构造函数,不能用来创建对象- Math中封装了很多数学计算相关的属性和方法。- 常用:    PI --> 圆周率 Math.PI    abs() --> 绝对值 Math.abs()    ceil() --> 上取整 Math.ceil()    floor() --> 向下取整 Math.floor();    round() --> 四舍五入取整    random() --> 生成一个0-1之间的随机数    max()    min() --> 取多个值中的最大值或最小值    sqrt() --> 开方    pow(x,y) --> 取x的y次幂- 生成一个指定范围的随机数- 生成一个x-y的随机数        var num = Math.round(Math.random()*(y-x)+x);

Date

- Date用来表示一个时间- 创建一个Date对象    var dt = new Date() //会创建一个时间的对象,这时间就是这行代码执行那一刻    var dt2 = new Date("10/12/2015 07:08:55") //根据时间的字符串创建一个指定的时间        - 时间格式:月/日/年 小时:分钟:秒- 方法:    getDate() --> 返回今天是几号     getDay() --> 返回今天是周几(0-6),0周日 1周一 6周六    getMonth() --> 获取当前的月份(0-11) 0一月,11十二月     getFullYear() --> 获取年份    getHours() --> 获取小时     getMinutes() --> 获取分钟    getSeconds() ---> 获取秒钟    getMilliseconds() --> 获取毫秒  1秒 = 1000毫秒     getTime() --> 获取当前时间的时间戳        - 所谓的时间戳指的是从1970年1月1日0时0分0秒到现在的时间所花费毫秒数    toLocaleString() --> 将时间转换为本地格式    Date.now() ---> 获取代码执行时的时间戳,用它可以用来计算程序执行的时间。