函数相关概念

最新推荐文章于 2024-05-22 13:52:22 发布

Kristen_Zyt

最新推荐文章于 2024-05-22 13:52:22 发布

阅读量179

点赞数

分类专栏： js 文章标签： javascript js

本文链接：https://blog.csdn.net/Fray_Zyt/article/details/118381852

版权

js 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

函数

定义：就是对代码的封装（函数就像一个盒子，然后把我们想要的代码放进去）；

需要该代码时，则需要调用；

函数定义：

定义的过程：

开空间（开启一个盒子）
把一段代码存储进去（是把代码当作字符串存储，此时不解析函数内的变量"console.log(num)"）
把这个空间的地址给到函数名称

函数在定义的时候没有解析函数内的变量，在函数执行的时候拿出来解析num变量；

1、声明式函数

语法：function 函数名(){ 要执行的代码 }；

()必须写，是用来放参数的位置

2、赋值式：定义一个变量一样

使用var 关键字，把一个函数当作值直接赋值给这个变量

var fn = function () {
    //一段代码
}
    // 不需要在function后面书写函数名了，前面已经有了

函数调用和区别：

浏览器里面有一个叫fn变量，这个变量代表了一个函数，可随时调用fn盒子，来执行一段代码；

定义位置无所谓在哪，在哪调用则在哪显示；

1、声明式函数调用：调用可在定义前也可在定义后

//可调用函数
fn ()

//声明式函数
function fn () {
    console.log('我是fn函数')
}

//可调用函数
fn ()

2、赋值式函数：只能在定义之后调用

//会报错
fn ()

//声明式函数
var fn = function () {
    console.log('我是fn函数')
}

//可调用函数
fn ()

函数的参数（重点）：形参、实参

形参：在函数定义的时候书写，是只能在函数内部使用的变量；

实参：在函数调用时，给形参赋值的；

arguments：

在每个函数内部，都有一个不需要操作就可以直接使用的数据，叫做arguments，是所有实参的集合；

console.log(arguments);
console.log(arguments.length);
arguments.lenght   是实参的个数

可通过 argument[下标] 获取每一个实参的值

console.log(arguments[0]);
console.log(arguments[1]);

下标必须从0开始！！

return：

该关键字用在函数内部；

作用：

1、表示结束当前的函数执行；

2、return可以给函数执行之后创造出一个结果，结果紧跟在return之后；

函数内不写return，函数调用到的结果是undefined；

函数内写了return，但不写东西，函数调用到的结果是undefined；

函数内写了return，写了东西，函数调用到的结果是写的东西；

预解析：

因为JavaScript是一个解释型语言，在代码执行之前，先对代码解析，再执行；

解释内容：

1、var 关键字

在代码执行之前，会把代码里所有的var 关键字声明的变量提升；

2、声明式函数

在代码执行之前，会把代码里的声明式函数的变量提升，并给这个变量赋值一个函数地址；

*变量提升：在代码执行之前，先告诉浏览器这个变量可以使用，只不过没有赋值；

*声明式函数提升：在代码执行之前，浏览器已经知道fn变量可以用，并且fn变量的值是一个函数地址；

作用域：

1、全局作用域：

一个页面就是一个全局作用域；
生命周期：从页面打开到页面关闭；

2、局部作用域：

只有函数能确定一个局部作用域；
局部作用域中声明的变量只能在当前的局部作用域中使用，外部不能使用；

作用域变量的访问规则(把这个变量拿过来用)：

当在任意一级作用域里边访问变量的时候，

如果自己有，则用自己的，否则就一级一级往上找(方向不可逆)，直到全局作用域，若全局作用域也没有，则报错；

作用域变量的赋值规则：

在任意一级作用域下，若要给一个变量赋值，

先看自己作用域内有没有，没有就往上找，有则赋值，没有则继续往上找，

直到全局作用域都没有的情况下，那么就把这个变量定义为全局变量，并赋值（这个变量也叫隐式全局变量）

事件：

是用户在网页上的动作，比如鼠标点击，鼠标移动，键盘按下...

1、事件三要素：事件源，事件名称，事件处理程序；

事件源：谁触发了这个事件（按钮 btn）

事件名称：触发了什么事件（点击事件 click）

事件处理程序：事件触发后要执行的代码（函数形式）

2、btn和网页中标签的id值相对应，on click鼠标点击，处理单机使用函数；如果有名的函数，就不要加小括号；

3、事件类型

鼠标事件：click 单击、dblclick 双击、mouseover 鼠标移入、mouseout 鼠标移除；

键盘事件：keydown 键盘按下事件、 keyup 键盘弹起事件、 keypress 敲打键盘事件；

表单事件：focus 获取焦点、 blur 失去焦点、 change 内容改变（失去焦点触发）、

input 表单输入（随着输入触发）、submit 表单提交事件（form标签触发）

浏览器窗口事件：load 页面加载事件（当网页中所有内容都加载完毕后触发）

scroll 浏览器窗口滚动事件；

4、使用方法

使用事件需要在事件名称前面加on（eg：鼠标事件）

btn.onclick = function(){
    console.log('单击事件')
}

btn.ondblclick = function(){
    console.log('双击事件')
}

btn.onmouseover = function(){
    console.log('鼠标移入')
}

btn.onmouseout = function(){
    console.log('鼠标移出')
}

window就是页面窗口（eg：浏览器事件，键盘事件）

window.onkeydown = function(){
    console.log('按下键盘')
}

window.onkeyup = function(){
    console.log('弹起键盘')
}

window.onkeypress = function(){
    var keyNum = e.keyCode;
    console.log(keyNum);   
    console.log('敲打键盘')
}

window.onscroll = function(){
    console.log('滚动')
}

eg：表单事件

username.onfocus = function(){
    console.log('失去焦点');
    console.log(username.value);   //表单中的输入框的value值
}

username.onblur = function(){
    console.log('失去焦点');
    console.log(username.value);   //表单中的输入框的value值
}

username.onchange = function(){
    console.log(username.value);  //表单中的输入框的value值
}

username.oninput = function(){
    console.log(username.value);   //表单中的输入框的value值
}

form.onsubmit = function(){
            //触发的标签是form 但是实际在网页中操作的是提交按钮
    alert('66666')
            // 阻止了表单的默认提交
    return false;
}

递归函数：

1、概念

是在函数内部调用函数自己；

写递归的时候，一定要规定什么时候停止，否会超出内存，变成死递归；

斐波那契额数列：第一个数和第二个数字都是1，第三个数字开始，每个数字是前两个数字的和

function fn(n){
    if(n == 1){
        return 1
    }if(n == 2){
            return 1
        }
        return fn(n-1)+fn(n-2)
}
var res = fn(10)
console.log(res);

对象：

基本概念：

1、概念：是js的一种数据类型，也是一个复杂数据类型；

2、对象是一个键值对的集合，对象就是一个盒子；

3、对象存储数据的格式：键值对；

4、对象语法：{ } 这是一个空对象

{key : value,key2 : value2}

5、语法规则：

键也叫做对象的属性，必须是字符串，键可以加引号，也可不加引号；
值可以是任意数据类型，包括：数字，字符串，布尔，对象，函数...
多个键值对之间用逗号隔开；
键值对之间没有顺序；

创建对象的两种方式：

1、字面量创建对象

var obj = {}   //使用字面量方式创建一个空对象
//   创建有数据的对象
var obj2 = {
    name:'',
    age:18,
    sex:'女'
}

2、通过系统内置构造函数创建对象

var obj3 = new Object()
// 通过系统构造函数创建对象，都是空对象

obj3.name = 'Rose'
obj3.age = 20
//向对象中添加成员

console.log(obj3);
// obj3 中存储的是 一个空间地址

3、创建对象时做的事情：

在内存空间中开了一个区域；
把对象中你要存储的数据放到该区域中；
把这个区域的地址给变量名；

操作对象：

主要操作：增删改查(CRUD) create read update delete

方法一：

1、添加数据成员

语法：对象.键 = 值

var obj = {}
obj.name = ''
obj.age = 18
obj.sex = '女'

1、添加数据成员【方二】

语法：数组关联语法对象['键'] = 值

var obj = {}
obj[age] = 18
obj[sex] = '女'

2、读取对象成员

语法：对象.键

console.log(obj.name)
console.log(obj.age)

2、读取对象成员【方二】

语法：对象['键']

console.log(obj['name'])
console.log(obj['age'])

3、修改对象成员

语法：对象.已有的键 = 值

obj.name = '新内容'
obj.age = 新内容
console.log(obj)  //输出的新obj对象中的name和age是修改后的内容

3、修改对象成员【方二】

语法：对象['已有的键'] = 值

obj['name'] = '新内容'

4、删除对象成员

语法：对象.键

delete obj.age
console.log(obj)   //输出的新对象中没有age该键

4、删除对象成员【方二】

语法：对象['键']

delete obj['age']

Kristen_Zyt

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
函数相关概念

函数定义：就是对代码的封装（函数就像一个盒子，然后把我们想要的代码放进去）；需要该代码时，则需要调用；函数定义：定义的过程：开空间（开启一个盒子）把一段代码存储进去（是把代码当作字符串存储，此时不解析函数内的变量"console.log(num)"）把这个空间的地址给到函数名称函数在定义的时候没有解析函数内的变量，在函数执行的时候拿出来解析num变量；1、声明式函数语法：function 函数名(){ 要执行的代码 }；()必须写，是用...
复制链接

扫一扫