JavaScript学习 Ⅳ
八. 批量创建对象
使用工厂方法创建对象
function creatPerson(name, age, gender='男'){
var obj = new Object();
obj.name = name;
obj.age = age;
obj.gender = gender;
obj.sayName = function(){
alert(this.name);
};
return obj;
}
使用工厂方法创建的对象,使用的构造函数都是Object
,所以创建的对象都是Object
类型,导致我们无法区分不同类型。
构造函数
为了使所创建的对象可以区分其类型,可以创建一个构造函数,专门用来创建该类对象。
构造函数就是一个普通的函数,创建方式和普通函数没有区别,不同的是构造函数习惯上首字母大写。
构造函数与普通函数的区别就是调用方式不同:
// 普通函数调用
fun();
// 构造函数调用
new fun();
构造函数的执行流程:
- 立即创建一个新的对象
- 将新建的对象设置为函数中的
this
,在构造函数中可以使用this
来引用新建的对象 - 逐行执行函数中的代码
- 将新建对象作为返回值返回
function Person(name, age, gender){
this.name = name;
this.age = age;
this.gender = gender;
this.sayName = function(){
alert(this.name);
};
}
使用同一个构造函数创建的对象,我们称为一类对象,也将一个构造函数称为一个类。
使用 instanceof 可以检查一个对象是否是一个类的实例
console.log(per instanceof Person);
上面的代码所创建的实例中都有 sayName 方法,这样就导致创建1000个实例就会创建1000个方法,而1000个方法都是一摸一样的。这样完全没有必要,完全可以使所有对象共享同一个方法。
方法一:
function Person(name, age, gender){
this.name = name;
this.age = age;
this.gender = gender;
this.sayName = fun;
}
function fun(){
alert(this.name);
}
将函数定义在全局作用域,污染了全局作用域的命名空间,而且定义在全局作用域中也很不安全。
原型 prototype
每一个javascript对象(除null外)创建的时候,就会与之关联另一个对象,这个对象就是我们所说的原型,每一个对象都会从原型中“继承”属性。
function Person(){}
function MyClass(){}
console.log(MyClass.prototype == Person.prototype)
// 不同函数原型不同
如果函数作为普通函数调用 prototype 没有任何作用
当函数以构造函数形式调用时,它所创建的对象中都会有一个隐含属性(__proto__
),指向该构造函数的原型对象。
原型对象相当于一个公共区域,所有同一个类的实例都可以访问这个原型对象,我们可以将对象中共有的内容,统一设置到原型对象中。
当访问对象的一个属性或者方法时,它会先在对象自身种寻找,如果有则直接使用。
// 向原型中添加属性
MyClass.prototype.a = 123;
// 向原型中添加方法
Myclass.prototype.sayHello = function(){
alert('hello');
};
将所有对象共有的变量和方法,可以添加入原型。
原型中的变量和方法,类似于Java中的静态变量和静态方法。可以被替换,不可被重写。
如果原型中含有某个属性时,使用in
运算符查询,也会返回true
可以使用对象的hasOwnProperty
,来检查对象自身中是否含有该属性。
原型对象也是对象,存在原型对象的原型。当我们使用一个对象的属性或方法时,会先在自身中寻找,如果自身中有,则直接使用,如果自身没有,则去原型对象中寻找,如果原型对象中没有,则到原型对象的原型中寻找,直到找到Object对象的原型。Object对象的原型没有原型。
当我们直接在页面中打印一个对象时,实际上是输出对象的toString()方法的返回值。
可以对方法进行重写。
垃圾回收(GC)
程序运行的过程中,会产生垃圾导致程序运行速度过慢,我们需要一个垃圾回收机制,来处理程序运行过程中的垃圾。
当一个对象没有任何的变量或属性对它进行引用,此时我们将永远无法操作该对象,这个对象就是一个垃圾,这种对象过多会占用大量内存空间,导致程序运行变慢。
JS中拥有自动的垃圾回收机制,会自动的将这些垃圾对象从内存中销毁。
我们只需要将不再使用的对象设置为null
九. 对象类型
内建对象
数组(Array):
- 数组也是一个对象
- 和普通对象功能相似,也是用来存储一些值的
- 普通对象使用字符串作为属性名,而数组使用数字作为索引操作元素
var arr = new Array();
arr[0] = 10;
arr[1] = 33;
var arr = [1,2,3,4,5]; // 使用字面量创建数组
使用length
属性可以修改或读取数组的长度,数组长度≠数组元素个数。
arr[arr.length] = 10; // 数据结尾添加新元素
var arr2 = new Array(10,20,30); // 使用构造函数
arr = [10]; // 创建只有一个元素的数组
arr2 = new Array(10); // 创建长度为10的数组
数组中的元素可以是任意数据类型,也可以是对象(函数)。
数组的方法
方法 | 描述 |
---|---|
concat() | 连接两个或更多的数组,并返回结果。 |
join() | 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。 |
pop() | 删除并返回数组的最后一个元素 |
push() | 向数组的末尾添加一个或更多元素,并返回新的长度。 |
reverse() | 颠倒数组中元素的顺序。 |
shift() | 删除并返回数组的第一个元素 |
slice() | 从某个已有的数组返回选定的元素。(start, end) |
sort() | 对数组的元素进行排序 |
splice() | 删除元素,并向数组添加新元素。 |
toSource() | 返回该对象的源代码。 |
toString() | 把数组转换为字符串,并返回结果。 |
toLocaleString() | 把数组转换为本地数组,并返回结果。 |
unshift() | 向数组的开头添加一个或更多元素,并返回新的长度。 |
valueOf() | 返回数组对象的原始值 |
join():该方法可以将数组转换为一个字符串,不会对原数组产生影响。传入参数为连接符。
sort():将数组进行排序,会改变原数组,默认按照Unicode进行排序。
对于纯数字的数组,依旧使用Unicode进行排序,可能得到错误的结果。
我们可以自己指定规则:
在sort()中添加一个回调函数,来指定排序规则,回调函数需要两个形参,浏览器将会分别使用数组中的元素作为实参去调用回调函数;
使用哪个元素是不确定的,但是可以肯定第一个参数在第二个参数之前;
浏览器会根据返回值来决定元素的顺序,如果返回一个大于0的值,则元素会交换位置,如果放回一个小于0的值,则位置不变。
arr = [5,4,2,1,3,6,7,8]
arr.sort(function(a, b){
if(a > b){
return 1;
}else if(a < b){
return -1;
}elseP{
return 0;
}
});
return a - b; // 升序排列
return b - a; // 降序排列
forEach
forEach()
方法需要一个函数作为参数:
- 像这种函数,由我们创建但是不由我们调用的,我们称为回调函数
- 数组中有几个元素,函数就会执行几次。每次执行时,浏览器会将遍历到的元素以实参的形式传递进来
- 浏览器会在回调函数中传递三个参数:currentValue、index、arr
function Person(name, age){
this.name = name;
this.age = age;
}
var per = new Person('孙悟空', 18);
var per1 = new Person('猪八戒', 28);
var per2 = new Person('沙和尚', 38);
var per3 = new Person('二郎神', 8);
var per4 = new Person('美猴王', 68);
var perArr = [per, per1, per2, per3, per4];
function sayHello(value, index, arr){
console.log(value.name+':Hello!');
}
perArr.forEach(sayHello);
splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。
注释:该方法会改变原始数组。
arrayObject.splice(index,howmany,item1,.....,itemX)
可以用于插入,删除,替换。
JavaScript学习 Ⅳ的更多相关文章
- JavaScript学习(一) —— 环境搭建与JavaScript初探
1.开发环境搭建 本系列教程的开发工具,我们采用HBuilder. 可以去网上下载最新的版本,然后解压一下就能直接用了.学习JavaScript,环境搭建是非常简单的,或者说,只要你有一个浏览器,一个 ...
- Web编程基础--HTML、CSS、JavaScript 学习之课程作业“仿360极速浏览器新标签页”
Web编程基础--HTML.CSS.JavaScript 学习之课程作业"仿360极速浏览器新标签页" 背景: 作为一个中专网站建设出身,之前总是做静态的HTML+CSS+DIV没 ...
- JavaScript学习(3):函数式编程
在这篇文章里,我们讨论函数式编程. 什么是函数式编程?根据百度百科的描述,“函数式编程是种编程典范,它将电脑运算视为函数的计算.函数编程语言最重要的基础是 λ 演算(lambda calculus). ...
- JavaScript学习(2):对象、集合以及错误处理
在这篇文章里,我们讨论一下JavaScript中的对象.数组以及错误处理. 1. 对象 对象是JavaScript中的一种基本类型,它内部包含一些属性,我们可以对这些属性进行增删操作. 1.1 属性 ...
- JavaScript学习13 JavaScript中的继承
JavaScript学习13 JavaScript中的继承 继承第一种方式:对象冒充 <script type="text/javascript"> //继承第一种方式 ...
- JavaScript学习12 JS中定义对象的几种方式
JavaScript学习12 JS中定义对象的几种方式 JavaScript中没有类的概念,只有对象. 在JavaScript中定义对象可以采用以下几种方式: 1.基于已有对象扩充其属性和方法 2.工 ...
- JavaScript学习11 数组排序实例
JavaScript学习11 数组排序实例 数组声明 关于数组对象的声明,以前说过:http://www.cnblogs.com/mengdd/p/3680649.html 数组声明的一种方式: va ...
- JavaScript学习10 JS数据类型、强制类型转换和对象属性
JavaScript学习10 JS数据类型.强制类型转换和对象属性 JavaScript数据类型 JavaScript中有五种原始数据类型:Undefined.Null.Boolean.Number以 ...
- JavaScript学习09 函数本质及Function对象深入探索
JavaScript学习09 函数本质及Function对象深入探索 在JavaScript中,函数function就是对象. JS中没有方法重载 在JavaScript中,没有方法(函数)重载的概念 ...
- JavaScript学习08 Cookie对象
JavaScript学习08 Cookie对象 JavaScript Cookie Cookie对象: Cookie是一种以文件的形式保存在客户端硬盘的Cookies文件夹中的用户数据信息(Cooki ...
随机推荐
- WinForm通用自动更新AutoUpdater项目实战
目前我们做的上位机项目还是以Winform为主,在实际应用过程中,可能还会出现一些细节的修改.对于这种情况,如果上位机带有自动更新功能,我们只需要将更新后的应用程序打包放在指定的路径下,可以让用户自己 ...
- Logstash下字段以及嵌套Json字段类型转换
前言 从filebeat传输到Logstash的数据,某个字段需要由string类型装换成float类型.但是不管怎么改logstash的配置文件都不生效,其实官方文档都有,但是具体细节方面的东西就得 ...
- tkinter操作练习一
# -*- utf-8 -*- #@Time :2019/8/2723:17 #@Author :无邪 #@File :t_ui.py #@Software:PyCharm import tkinte ...
- APP自动化1——Appium+pycharm自动化环境搭建全流程
1. 安装python3,pycharm,可参考之前写的文档:https://www.cnblogs.com/chenweitoag/p/13154815.html 2. 准备以下必要工具: 基于wi ...
- Java基本数据类型和包装类
一:八大基本类型 二:基本数据类型及包装类 三:基本类型和包装类的区别 1:定义不同.封装类是对象:基本类型不是. 2:使用方式不同.包装类需要先new初始化,再通过JVM根据具体情况实例化后赋值:基 ...
- C#数据结构与算法系列(十):中缀表达式转后缀表达式
1.具体步骤 1)初始化两个栈:运算符栈s1和储存中间结果的栈s2:2)从左至右扫描中缀表达式:3)遇到操作数时,将其压s2:4)遇到运算符时,比较其与s1栈顶运算符的优先级: (1)如果s1 ...
- sharding-jdbc源码解析
参考博客:https://cloud.tencent.com/developer/article/1529692 看sharding-jdbc支持XA协议重点看下面的代码 sharding-trans ...
- elk4
传统问题: 微服务系统下服务器数量过大,如果还在使用依次登录每台机器的传统方法查询日志,这样效率非常低下.ELK 是elastic公司提供的一套完整的日志收集以及展示的解决方案,是三个产品的首字母缩写 ...
- mysql 中order by的优化
当时看了尚硅谷周阳老师的mysql视频优化在order by 优化的时候还存在一点问题:后来阅读了mysql的官方文档,对该问题已经测定研究清楚了 内容如下: http://blog.51cto.co ...
- Java 将PDF/XPS转为Word/html /SVG/PS/PCL/PNG、PDF和XPS互转(基于Spire.Cloud.SDK for Java)
Spire.Cloud.SDK for Java提供了接口PdfConvertApi通过convert()方法将PDF文档以及XPS文档转为指定文档格式,如转PDF为Word(支持Docx.Doc). ...