js高级03
一、函数的定义和调用
1.函数定义方式:
1)自定义函数
function fn(){};
2)函数表达式
var fun=function(){};
3)利用new Function(‘参数1’,‘参数2’,‘函数体’)
var fn=new Function(‘参数1’,‘参数2’,‘函数体’)
a.Function里面都必须是字符串格式
b.第三种方式执行效率低,也不方便书写,因此较少使用
c.所有函数都是Function的实例(对象)
2.函数的调用方式:
2.this指向问题:
点击
3.改变函数内部的this指向:
call() apply() bind()主要应用场景
1)call经常做继承
2)apply经常和数组有关,比如借助于数学对象实现数组最大值和最小值
3)bind不会调用函数,但是还想改变this指向,比如改变定时器内部的this指向
// 2. apply() 应用 运用的意思
var o = {
name: ‘andy’
};
function fn(arr) {
console.log(this);
console.log(arr); // 'pink'
};
fn.apply(o, ['pink']);
// 1. 也是调用函数 第二个可以改变函数内部的this指向
// 2. 但是他的参数必须是数组(伪数组)
// 3. apply 的主要应用 比如说我们可以利用 apply 借助于数学内置对象求数组最大值
// Math.max();
var arr = [1, 66, 3, 99, 4];
var arr1 = ['red', 'pink'];
// var max = Math.max.apply(null, arr);
var max = Math.max.apply(Math, arr);
var min = Math.min.apply(Math, arr);
console.log(max, min);
点击 点击 点击
4.严格模式:
IE10以上才支持,旧版本浏览器中会被忽略,即在严格条件下运行js代码
严格模式对正常的js语义做了一些更改:
1)消除了js语法的一些不合理、不严谨之处,减少了一些怪异行为
2)消除代码运行的一些不安全之处,保证代码运行的安全
3)提高编译器效率,增加运行速度
4)禁用了在ECMScript的未来版本中可能会定义的一些语法,为未来版本的Javascript做好铺垫。比如一些保留字如:class、enum、export、extends、import、superr不能做变量名
<script>
'use strict';
// 下面的js 代码就会按照严格模式执行代码
</script>
<script>
(function() {
'use strict';
})();
</script>
<!-- 为某个函数开启严格模式 -->
<script>
// 此时只是给fn函数开启严格模式
function fn() {
'use strict';
// 下面的代码按照严格模式执行
}
function fun() {
// 里面的还是按照普通模式执行
}
</script>
5.严格模式中的变化:
1)变量名必须先声明后使用
2)不能随意删除已经定义好的变量
3)严格模式下全局作用域中的this是undefined
4)严格模式下,如果构造函数不加new调用,this会报错
5)new实例化的构造函数指向创建的对象实例
6)定时器this指向的还是window
7)函数里面不能有重名的参数
8)不允许在非函数的代码块内声明函数
6.高阶函数:
1)接收函数为参数
2)将函数作为返回值输出
7.闭包:指有权访问另一个函数作用域中变量的函数
一个作用域可以访问另外一个函数的局部变量
- 榴莲
- 臭豆腐
- 鲱鱼罐头
- 大猪蹄子
榴莲
臭豆腐
鲱鱼罐头
大猪蹄子
// 闭包应用-计算打车价格
// 打车起步价13(3公里内), 之后每多一公里增加 5块钱. 用户输入公里数就可以计算打车价格
// 如果有拥堵情况,总价格多收取10块钱拥堵费
// function fn() {};
// fn();
var car = (function() {
var start = 13; // 起步价 局部变量
var total = 0; // 总价 局部变量
return {
// 正常的总价
price: function(n) {
if (n <= 3) {
total = start;
} else {
total = start + (n - 3) * 5
}
return total;
},
// 拥堵之后的费用
yd: function(flag) {
return flag ? total + 10 : total;
}
}
})();
console.log(car.price(5)); // 23
console.log(car.yd(true)); // 33
console.log(car.price(1)); // 13
console.log(car.yd(false)); // 13
</script>
8.递归:
如果一个函数在内部可以调用其本身,那么这个函数就是递归函数