JS函数基础
一.函数
1.函数是什么
- 具有特定功能的n条语句的封装体。
- 只有函数是可执行的,其它类型的数据是不可执行的。
- 函数也是对象。
2.为什么要用函数
- 提高代码复用
- 便于阅读和交流
3.如何定义函数
- 函数声明
- 表达式
function fun1(){
console.log("函数声明定义函数");
} var fun2 = function(){
console.log("表达式定义函数")
}
4.如何调用函数
- test()
- new test()
- obj.test()
- test.call(objx)/test.apply(objx)
function fun(){
console.log("fun执行");
} //1.函数自调用,相当于window.fun()调用方式
fun(); //2.回调函数:事件回调,定时器回调
document.getElementById("btn").onclick = function(){
console.log("事件回调");
} setTimeout(function(){
console.log("定时器回调");
},1000); //3.构造函数:实例化对象调用(this指向当前构造函数的实例对象)
function Person(name,age){
this.name = name;
this.age = age;
} var person1 = new Person('小红',17); //4.call,apply强制绑定this
var obj1 = {name:"obj1"};
function fun2(){
console.log(this);//用于输出当前this所绑定的对象
} fun2(); //this = window
fun2.call(obj1); //this = Object {name: "obj1"}
fun2.apply(obj1); //this = Object {name: "obj1"}
5.回调函数
(1)什么函数是回调函数
- 你定义的
- 你没有直接执行
- 最终他执行了(在特定条件下)
(2)常见的回调函数
- DOM事件函数
- 定时器函数
- ajax回调函数
- 生命周期回调函数
document.getElementById("btn").onclick = function(){
console.log("DOM事件回调");
} setTimeout(function(){
console.log("定时器回调");
},1000);
6.IIFE
全称: Immediately-Invoked Function Expression
别名:函数自调用,立即执行函数,IIFE
特点:
- 只执行一次
- 代码执行到函数是,此函数就执行了
- 函数的数据是私有的
7.this
- this是关键字,不能用来定义对象
- this本身是一个内置的变量,该变量指向一个对象
- this有两种:
- 全局this:指向window
- 局部(函数)this:指向它的调用者(例如:构造函数的this指向实例对象)
- 特殊this:call,apply强制修改this
function fun1(){ console.log("外部fun1:");
console.log(this);
this.name = "小红"; } var obj = {
fun2: function(){
console.log("内部fun2:");
console.log(this);
}
} window.fun1(); // this = window
new fun1(); // this = 实例对象(fun1{})
fun1.call(obj); //this = obj
注:使用new 操作符执行步骤:
语法:new fun1();
- 创建空对象
- 执行函数
- 确认this指向
- 返回执行结果:fun1{} 给空对象
此图可以看出new fun1();首先创建一个空对象去指向这个fun1,再给予this的name属性创建并赋值。
JS函数基础的更多相关文章
- js函数基础回顾
回头又跑去看了下尚硅谷的js基础视频 https://www.bilibili.com/video/av22958172/?p=51. 便做了如下笔记: 1.函数也是一个对象 2.函数可以封装一些功能 ...
- js函数基础知识
[函数的声明及调用] function 函数名(参数1,参数2,....){ //函数体代码 return返回值: } 1.函数的调用: ①直接调用:函数名(参数1的值,参数2的值,....) ②事件 ...
- js 函数基础(方便复习使用)
// 函数声明: function bbq(){ // ..... } // 函数表达式: // 1.命名函数表达式 var test = function abc(){ document.write ...
- JS 函数基础
函数简介 函数 函数也是一个对象 函数中可以封装一些功能(代码),在需要时可以指向这些功能(代码) 函数中可以保存一些代码在需要时调用 使用typeof检查一个函数对象时,会返回function 创建 ...
- Js函数function基础理解
正文:我们知道,在js中,函数实际上是一个对象,每个函数都是Function类型的实例,并且都与其他引用类型一样具有属性和方法.因此,函数名实际上是指向函数对象的指针,不与某个函数绑定.在常见的两种定 ...
- 100多个基础常用JS函数和语法集合大全
网站特效离不开脚本,javascript是最常用的脚本语言,我们归纳一下常用的基础函数和语法: 1.输出语句:document.write(""); 2.JS中的注释为//3.传统 ...
- JavaScript基础精华02(函数声明,arguments对象,匿名函数,JS面向对象基础)
函数声明 JavaScript中声明函数的方式:(无需声明返回值类型) function add(i1, i2) { return i1 + i2;//如果不写return返回 ...
- 基础常用JS函数和语法
100多个基础常用JS函数和语法集合大全 来源:http://www.cnblogs.com/hnyei/p/4605103.html 网站特效离不开脚本,javascript是最常用的脚本语言,我 ...
- (day65、66)Vue基础、指令、实例成员、JS函数this补充、冒泡排序
目录 一.Vue基础 (一)什么是Vue (二)为什么学习Vue (三)如何使用Vue 二.Vue指令 (一)文本指令 (二)事件指令v-on (三)属性指令v-bind (四)表单指令v-model ...
随机推荐
- MQTT和Coap
什么是MQTT? MQTT是一个“发布和订阅”协议.用户可以订阅某些主题,或发布某些主题的消息.订阅者将收到订阅的主题消息.用户可以通过保证交付来配置协议更可靠. 什么是CoAP? CoAP看起来像是 ...
- java log4j 打日志到控制台同时打印到不同文件
1.pom配置 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="htt ...
- Python网络编程、爬虫之requests模块使用
一.python操作网络,也就是打开一个网站,或者请求一个http接口,使用urllib模块. urllib模块是一个标准模块,直接import urllib即可,在python3里面只有urllib ...
- MySQL之Python与Mysql交互
一:Python操作MySQL步骤 1:Python中操作MySQL的步骤 2.引入模块 在.py文件中引入pymysql模块 import pymysql pymysql是python的一个第三方与 ...
- Java自学-数字与字符串 装箱和拆箱
Java中基本类型的装箱和拆箱 步骤 1 : 封装类 所有的基本类型,都有对应的类类型 比如int对应的类是Integer 这种类就叫做封装类 package digit; public class ...
- Java自学-接口与继承 抽象类
Java 抽象类 在类中声明一个方法,这个方法没有实现体,是一个"空"方法 这样的方法就叫抽象方法,使用修饰符"abstract" 当一个类有抽象方法的时候,该 ...
- Java自学-操作符 关系操作符
Java的关系操作符 关系操作符:比较两个变量之间的关系 > 大于 >= 大于或等于 < 小于 <= 小于或等于 == 是否相等 != 是否不等 示例: public clas ...
- MFC中窗口重绘
搬家于CSDN 2015-05-14 MFC提供了三个函数用于窗口重绘 InvalidateRect(&Rect) Invalidate() UpdateWindow() 当需要更新或者重绘窗 ...
- Beego学习笔记6:分页的实现
实现分页的效果 1> 分页的实现的业务逻辑 1->每个页面显示N条数据,总的数据记录数M,则分页的个数为M%N==0?M/N:M/N+1; 2->页面渲染分页的html部分 ...
- 87.CSS Flex 弹性盒模型布局教程(共用的css在48篇文章gird)
CSS Flex 弹性盒模型布局教程 Flex 是 Flexible Box 的缩写,意为"弹性布局",用来为盒状模型提供最大的灵活性. flex布局就是给任何一个容器添加 dis ...