文章目录
函数
含义
函数
也是一个对象
函数中可以封装一些代码,在需要的时候可以执行这些功 能
封装到函数中的代码不会立即执行,会在函数调用的时候执行
函数调用语法
函数对象();
当调用函数时,函数中封装的代码会按顺序执行
//创建一个函数对象,可以将要封装的代码以字符串的形式传递给构造函数
//基本上不会使用这种使用方式
var fun = new Function("console.log('构造函数,不推荐使用');");
fun(); // 输出:构造函数,不推荐使用
函数声明
常用函数声明来创建一个函数
语法:
function 函数名(形参1, 形参2, ...){
语句
}
函数表达式创建函数:
var 函数名 = function(形参1, 形参2, ...){
语句
}
//函数声明:
function fun2(){
console.log("函数声明创建的函数");
}
fun2(); // 输出:函数声明创建的函数
//函数表达式
var fun3 = function(){
console.log("函数表达式创建的函数");
}
fun3(); //输出:函数表达式创建的函数
函数的参数
定义一个用来求和的函数
可以在函数的()指定一些形参,并且用, 隔开
在调用函数时,可以咋()中指定实参,实参会赋值给函数中对应的形参
调用函数时解析器不会检验实参的类型,所以可能需要对参数进行类型检查
也不会检查实参的数量,多余实参不会被赋值
如果实参的数量少于形参的数量,则没有对应实参的形参将是undefined
实参可以是任意数据类型,可以是一个对象,也可以是一个函数
当我们的参数过多时,可以将参数封装到一个对象中然后通过对象调用
fun()
调用函数,相当于使用函数的返回值
fun
函数对象,相当于使用函数对象
代码解释:
function sum(a, b){
console.log(a + b);
}
sum(1,2); // 输出:3
//例题:
//定义一个函数,判断一个数字是否是偶数。如果是返回true,否则返回false
function fun1(num){
return num % 2 == 0;
}
var result = fun1(2); // 返回true
//定义一个函数,可以根据半径计算一个圆的面积,并返回计算结果
function area(r){
return 3.14 * r * r;
}
result = area(10); // 返回314
//当实参是一个对象时
function fun2(o){
console.log("姓名为:" + o.name + "年龄为:" + o.age);
}
var obj = {
name: "wq",
age: 18
}
fun2(obj);//输出:姓名为:wq年龄为:18
//当实参是一个函数时
function fun3(fun2){
fun2(obj);
}
fun3(fun2); //输出:姓名为:wq年龄为:18
函数的返回值
创建一个函数,用来计算三个数的和
可以使用return 来设置函数的返回值
语法: return 值;
return后的值会作为函数的执行结果返回,可以定义一个变量接受执行结果
如果return语句后不跟任何值就相当于返回一个undefined,不写也是
返回值可以是任意数据类
使用return可以结束整个函数
function sum(a, b, c){
return a + b + c;
alert("hello") // 此语句不执行
}
sum(1,2,3) // 无输出
var num = sum(1,2,3);
console.log(num); // 输出:6
立即执行函数
立即执行函数:
函数定义完成,立即被调用
这种函数往往只会执行一次
//立即执行函数
(function(a, b){
console.log(a + b);
})(12, 23); //输出:35
构造函数
构造函数就是一个普通函数,创建方式与普通函数没有区别
不同的是构造函数手字母大写
区别:
普通函数是直接调用,构造函数需要使用new关键字调用
构造函数执行流程:
1.立刻创建一个新的对象
2.将新建的对象设置为函数中的this
3.逐行执行函数中的代码
4.将新建的对象作为返回值返回
使用同一个构造函数创建的对象称为一类对象,也将一个构造函数称为一个类
通过一个构造函数
function Student(name, age, gender){
this.name = name;
this.age = age;
this.gender = gender;
}
var stu = new Student("姓名", 18, "性别");
console.log(stu.age); // 输出 18
使用instanceof可以检查一个对象是否是一个类的实例
语法:
对象 instanceof 构造函数
如果是则返回true,不是返回false
console.log(stu instanceof Student); // true
console.log(stu instanceof Object); // true (所有对象都是Object的后代)
解析器
解析器在调用函数每次都会向函数内部传递一个隐含的参数,
这个隐含的参数就是this,this指向的是一个对象
这个对象我们称为函数执行上下文对象
根据函数的调用方式,this会指向不同的对象
1.以函数的形式调用时,this永远都是window
2.以方法形式调用时,this就是调用方法的那个对象
var name = "全局";
function fun(){
console.log(this.name);
}
var obj1 = {
name:"姓名1",
realName: fun
}
var obj2 = {
name: "姓名2",
realName: fun
}
obj1.realName(); //输出 姓名1
obj2.realName(); //输出 姓名2
fun(); //输出 全局
原型
原型: prototype
我们创建的每一个函数,解析器都会向函数中添加一个属性prototype
这个属性对应了一个对象,就是原型对象
如果函数作为普通函数调用prototype没用任何作用
当函数以构造函数的形式调用时,它所创建的对象中都会有一个隐含属性,
指向该构造函数的原型对象,我们可以通过__proto__来访问该属性
原型对象就相当于一个公共区域,所有同一个类的实例都可以访问到这个原型对象,
我们可以将对象中共有的内容,统一设置到原型对象中
当我们访问对象的一个属性或方法时,它会先在对象中寻找,再在原型对象中寻找
在创建构造函数中,可以把共有的属性和方法统一添加到构造函数的原型对象中
原型对象也是对象,它也有原型
当我们使用一个对象的属性或方法时,会先在自身中寻找,如果自身没有就去原型里面找
原型里面没有再到原型的原型里面找
原型的原型为Object的原型,是最深层次的原型,它的原型就没有原型了,如果都没有这个方法则会返回undefined
function Student(){
}
Student.prototype.name = "小明";
var a = new Student();
var b = new Student();
console.log(a.name); // 都输出小明
console.log(b.name);
//使用in检查对象中是否含有某个属性,如果对象没有原型中有也会返回true
console.log("name" in a); // true
//可以使用对象的hasOwnProperty()来检查对象自身中是否含有该属性
console.log(a.hasOwnProperty("name")); // false
垃圾回收
程序运行过程中会产生垃圾,导致程序运行的速度过慢
需要一个垃圾回收机制,处理运行过程中的垃圾
当一个对象没有任何的变量或属性对它进行引用,此时我们将永远无法操作该对象,这种对象会占用大量内存空间,导致程序运行变慢
所以垃圾必须进行清理
在JS中有自动垃圾回收机制,我们只需要将不再使用的对象设置成null即可
作用域
作用域:
作用域指一个变量的作用的范围
在JS中一共有两种作用域
1.全局作用域
直接编写在script标签中的JS代码,都在全局作用域
全局作用域在页面打开时创建,在页面关闭时销毁
在全局作用域中有一个全局对象window代表我们浏览器的窗口,
我们可以直接使用
在全局作用域中:
我们创建的对象都会作为window对象属性保存,创建的函数都会作为window对象的方法保存
其中的变量都是全局变量,在任意的部分都可以访问的到
2.函数作用域
调用函数时创建函数作用域,函数执行完毕以后,函数作用于销毁
每调用一次函数就会创建一个新的函数作用域,他们之间是互相独立的
在函数作用域中可以访问到全局作用域的变量,全局作用域中无法访问到函数作用域拒变量
当在函数作用域操作一个变量时,它会先在自身作用域中寻找,再去上一级作用域中寻找
在函数中想访问全局属性可以使用window
//全局作用域
<script type="text/javascript">
//这里面的代码都叫做全局作用域
function fun(){
//这里面的代码叫做函数作用域,当函数执行完毕后销毁
}
</script>
变量声明提前:
使用var关键字声明的变量,会在所有的代码执行之前被声明但不会赋值
但是如果声明的变量时不使用var关键字,则变量不会被声明
函数声明提前:
使用函数声明形式创建的函数会在所有代码执行之前就被创建,所以我们可以在函数声明之前就调用函数
使用函数表达式创建的函数,不会被声明提前,所以不能在声明前被调用
//函数声明:
function fun(){
}
//函数表达式
var fun = function(){
}
方法
定义
函数也可以成为对象的属性
如果一个函数作为一个对象的属性保存,那么我们称这个函数是这个对象的方法,
枚举对象的属性
使用for ... in 语句
语法:
for(var 变量 in 对象){
}
在对象中有几个属性,循环体就会循环几次
var obj = {
name : "函数",
fun1 : function(){
console.log("对象内的函数");
}
}
obj.fun(); // 输出 : 对象内的函数
//枚举对象的属性
for(var n in obj){
//console.log(n); //输出属性名: name, fun
console.log(obj[n]); //输出属性值:
}
call() 和 apply() 方法
call() 和 apply()
这两个方法都是函数对象的方法,需要通过函数对象来调用
在调用这两个方法时可以将一个对象指定为一个参数
此时这个对象将会成为函数执行时的this
call()方法可以将实参封装到一个数组中统一传递
apply()方法需要将实参封装到一个数组中传递
this的情况
1.以函数形式调用时,this永远都是window
2.以方法形式调用时,this是调用方法的对象
3.以构造函数形式调用时,this是新创建的那个对象
4.使用call()和apply()调用时,this是指定的那个对象
Date() 和 Math() 方法
Date()
在JS中使用Date对象表示一个时间
//创建一个Date对象
var d = new Date();
console.log(d); // 当前时间
//创建一个指定时间对象
//在构造函数中传递一个表示时间的字符串作为参数
//格式: 月份/日/年 时:分:秒
var d2 = new Date("11/11/2021 8:08:08");
console.log(d2);
//getDate():获取当前日期独显是几日
var date = d2.getDate();
console.log(date); // 11
//getDay() 获取当前日期对象是周几 ,0表示周日
date = d2.getDay();
console.log(date);
//getMonth() 获取当前时间月份,0表示1月,1表示2月
//getFullyuar() 获取当前日期的年份
//getTime() 获取当前日期对象的时间戳:从1970年1月1日到当前时间的毫秒数
date = d2.getTime();
console.log(date); //1636589288000
//获取当前的时间戳,这行代码执行的时间
time = Date.now();
Math()
Math不属于构造函数
属于一个工具类,不用创建对象,里面封装了数学相关的属性和方法
如:
Math.PI 表示圆周率
方法:
abs() 可以用来返回数的绝对值
ceil() 对一个数向上取整,小数位有值就向上进一
floor() 对一个数向下取整
round() 对一个数四舍五入取整
random() 可以用来一个0-1之间的随机数,
pow(x,y) 返回x的y次方
生成一个0-x之间的随机数:Math.round(Math.random()*x)
生成一个x-y之间的随机数:Math.round(Math.random()*(y-x)*x)
max() 获取多个数中的最大值
var num = -10;
// abs()
console.log(Math.abs(num)); //10
//ceil()
num = 1.2;
console.log(Math.ceil(num)); //2
//floor()
console.log(Math.floor(num)); //1
//round()
console.log(Math.round(num)); //1
//random()
console.log(Math.random()); //0.6624209541942156
//max()
console.log(Math.max(10,30,4,89)); //89
//pow()
console.log(Math.pow(2,2)) // 4
arguments
在调用函数时,浏览器每次传递进两个隐含的参数
1.函数的上下文对象this
2.封装实参的对象arguments
arguments是一个类数组对象,在调用函数时,我们所传递的实参都会在arguments中保存
可以用来获取实参的长度,不需要定义形参也能使用实参
其中有一个callee属性,可以对应当前正在指向的函数对象
使用工厂方法创建对象
可以避免许多重复代码
function createStudent(name, age, gender){
var obj = new Object();
obj.name = name;
obj.age = age;
obj.gender = gender;
return obj;
}
var obj = createStudent("小明", 18, "男");
console.log(obj); // 输出: {name: "小明", age: 18, gender: "男"}