这里写目录标题
1.函数的定义和调用
- 函数的声明方式:function 关键字(命名函数)
function fn(){}
- 函数表达式;匿名函数
var fun=function(){}
- new function (“参数1”,“参数2”,“函数体")
- 所有的函数都是function的实例
2.函数的调用方式
- 普通函数
//1.普通函数
function fn() {
console.log(111);
}
fn();
- 对象方法
//2.对象方法调用函数
var o = {
sayhi: function() {
console.log(22);
}
}
o.sayhi();
- 构造函数
function Star() {
console.log(33);
};
new Star();
- 绑定事件函数
var btn = document.querySelector(“button”);
btn.addEventListener(“click”, function() {
console.log(44);
})
- 定时器函数
//5.定时器函数,事件到了就被调用
setInterval(function() {
console.log(55);
}, 1000);
- 立即执行函数
//6.立即执行函数
(function() {
console.log(66);
})();
3.this知识
1.函数里this的指向
调用方式 | this指向 |
---|---|
普通函数 | window |
构造函数 | 实例对象,原型对象里的方法也指向实例对象 |
构造函数函数 | 该方法所属对象 |
事件绑定函数 | 绑定事件对象 |
定时器函数 | window |
立即执行函数 | window |
2.改变函数内部this指向
1.call()
- 可以调用函数和实现改变函数内部的this的指向
- 还可以实现继承
- fun.call(thisArg,arg1,arg2),thisArg是指在fun函数运行时指定的this值
//call()可以调用函数和改变函数内部this的指向
function Father(uname, age) {
this.uname = uname;
this.age = age;
}
function Son(uname, age) {
Father.call(this, uname, age);
}
var son = new Son("刘德华", 28);
console.log(son);
2.apply()
- 可以调用函数和实现改变函数内部的this的指向
- fun.apply(thisArg,[argsArray])
- thisArg是指在fun函数运行时指定的this值
- [argsArray]是指传递的值必须包含在数组里
var o = {
name: "ycq"
};
function fn(arr) {
//普通函数指向的this的window
// console.log(this);
console.log(arr);
}
//这里就把this指向对象改成了o
fn.apply(o, ["pink"]);
var arr = [1, 51, 13, 136];
//Math调用就是指向的math,传递的值就是arr
var max = Math.max.apply(Math, arr);
console.log(max);
3.bind()
- 不会调用函数,但能改变函数内部this指向
- fun.bind(thisArg,arg1,arg2,…),一般用var xx来接一下这个函数
- 返回用指定的this值和初始化参数改造的原函数拷贝
- 适用于有的函数不需要立即调用,但是又想改变函数内部的this指向
<button>点击</button>
<script>
var o = {
name: "ycq"
};
function fn(x, y) {
console.log(this);
console.log(x + y);
}
//不会调用函数,但是可以改变函数内部this的指向
var f = fn.bind(o, 1, 2);
f();
//有一个按钮,当点击了之后就禁用,三秒之后在使用
var btn = document.querySelector("button");
btn.addEventListener("click", function() {
//点击事件里面的this指向的是btn绑定事件对象
this.disabled = true;
//定时器函数里面的this指向的是window
setTimeout(function() {
btn.disabled = false;
}, 3000);
})
</script>
4.严格模式
1、优点
- 消除了js语法中不合理的不严谨之处
- 消除了代码中不安全的地方
2.应用
- 整个脚本中:在的第一行添加上"use strict"
- 个别函数中:放在个别函数的第一行,函数内下边的代码严格执行严格模式,函数外的代码是普通模式执行
3.变化
1.变量规定
- 严格模式禁止使用一个变量没有声明就赋值,必须先用var赋值之后再使用
- 严格模式严禁用delete 变量删除已经指明的变量
2.严格模式下this指向的是undefined
- 严格模式下,若构造函数不加new调用,this指向undefined时会报错
- new实例化的构造函数指向创建的实例对象
- 严格模式下定时器里面的this仍然指向window
- 事件、对象里面的函数还是指向调用者
3.函数变化
- 不能有重名的参数
- 不允许在非函数的代码块声明函数 例如:for,if语句带有{}
5.高阶函数
- 高阶函数是指接受函数作为参数或者是将函数作为返回值输出
- 函数可以作为参数进行传递
- 函数也是一种数据类型,同样可以作为参数传递给另一个参数使用,最典型的就是作为回调函数
6.闭包
1.变量作用域
局部变量,函数执行完之后就会被销毁
全局变量
2.闭包
- 闭包是一个函数有权访问另一个函数作用域里面的变量(局部变量)
- 这个函数既如果是内部的,直接调用即可
- 如果是外部的,函数内返回return 函数;在函数外边用var xx=函数();即可
<script>
function fn() {
var num = 10;
function fun() {
console.log(num);
}
//这个是相当于内部的闭包
//fun();
//外部的闭包是用return
return fun();
}
//内部的
//new fn();
//外部的
var f = fn();
</script>