行业知识
深入探讨javascript的流程控制与分支结构,以及js的函数
2026-11-09 21:41:26
来源:互联网转载
✨✨ ���迎大家来到景天科技苑✨✨
养成好习惯,先赞后看哦~
所属的专栏:前端泛海
景天的主页:景天科技苑
文章目录
- 1.流程控制与分支结构
- 1.if分支结构
- 2.switch case 分支结构
- 3.循环结构
- 2.函数
- 1.函数定义方式一 :普通函数
- 2.函数定义方式二:匿名函数
- 3.变量提升
- 4.函数定义方式三:不推荐 (了解) 把代码写在Function()里面
- 5.函数定义方式四:闭包函数
- 6.函数定义方式五:箭头函数
- 7.函数参数 (普通位置参数,默认参数)
- 8.arguments 自动收集所有的实参,是个数组
- 3.函数调用
1.流程控制与分支结构
在javascript中的一个程序执行的过程中,各条代码的执行顺序对程序的结果是有直接影响的。
很多时候我们要通过控制代码的执行顺序来实现我们要完成功能。
简单理解︰流程控制就是来控制我们的代码按照什么结构顺序来执行
流程控制主要有三种结构,分别是顺序结构、分支结构和循环结构,这三种结构代表三种代码执行的顺序。
1.if分支结构
流程控制 -> 分支结构 var mashengni = "美女"; //1.单项分支 // if(mashengni == "美女"){ // alert("给他买好吃的~"); // } //2.双项分支 // if(mashengni == "野兽"){ // alert("给他一榔头~"); // }else{ // alert("跳起来给他一榔头~"); // } //3.多项分支 // 不推荐判断条件连续比较,有可能失效; 多条件用&& 连接才行,不能用 10000 console.log("正常薪资范围~"); }else if(12000 console.log("超过一般水平~"); }else if(15000 console.log("大神级毕业生~"); }else if(salary = 18000){ console.log("王牌毕业生~"); }else{ console.log("回炉重生~") } //4.巢状分支,分支嵌套 var youqian = true; var youfang = true; if(youqian){ if(youfang){ console.log("老子要嫁给你~!"); } } 创建变量// let -> 创建变量// const -> 创建常量// function fn(){// // 提前声明name, 这种现象叫变量提升// // 站在开发人员的角度分析. 是不合理的.// console.log(name);// var name = '大马猴'; // 正常人理解. 应该是报错的.// // 新版本的js -> es6 对变量的提升进行的修复.// // let声明的变量. 没有变量提升// }// fn()// 常量的声明,不希望后续的程序去修改该变量的值// const BIRTH_DAY = 2000;//// BIRTH_DAY = 1998; // 把规范的东西标准化// console.log(BIRTH_DAY);变量提升,打印出name undefined
const 修饰的常量不允许修改,强制修改报错
4.函数定义方式三:不推荐 (了解) 把代码写在Function()里面
// var func3 = new Function("alert('我是func3~');alert('woshi3333');"); // console.log(func3,typeof(func3)); // func3(); 带参数,前面写参数,后面写代码体 // var func4 = new Function("x","y","alert(x+y)"); // func4(5,6);5.函数定义方式四:闭包函数
function func5(){ var a = 100; function func6(){ console.log(a,""); return "我是闭包函数"; } return func6;}func = func5();res = func();console.log(res);内函数使用了外函数的变量,外函数将内部函数返回出来
func6是闭包函数
在一个html中引入多个js文件时,大概率会出现变量名冲突的变量
怎样才能让自己代码的变量名与别人的不冲突呢
将变量名设为局部变量
外部要想用到局部变量,则需要将变量返回出来
此时就用到了闭包
// rsa 加密 -> key// 这里直接用var声明的东西. 自动进window(function(){ // 局部变量 // 外界无法对key进行修改 var key = "22222222"; var b64 = function(){ console.log("我是rsa, 我也需要b64"); } // 提供给外界的一个接口. // 外界使用该变量来访问闭包中的功能 window.rsa = function(){ console.log("我也要开始加密了. 我是rsa") b64(); console.log(key); return "rsa加密结果"; }})()6.函数定义方式五:箭头函数
function mysum(x,y){ return x+y;}res = mysum(5,6)console.log(res,"");var mysum = (x,y) => {return x+y;} var res = mysum(5,6);console.log(res,"========3334444=========");=>箭头函数,把一个函数传递到另一个函数,作为参数
箭头格式不能变,一定得是向右指向
// if (a > 5) console.log(3333333); // 如果只有一句话.可以省略大括号// else {// console.log(6666666);// }// let fn = function(){// console.log("你好啊");// }//// fn();//// // 箭头函数// let gn = ()=>{// console.log("我不叫赛利亚");// }//// gn();// setTimeout(()=>{// console.log("123")// }, 1000);// // 如果只有1个参数. 可以省略() // let an = n => { // console.log(n); // } // // an(18); // // 慢慢捋 // function fn(n, m){ // m(n); // // } // // a = 10; // fn(a, n => { // console.log(n); // });7.函数参数 (普通位置参数,默认参数)
// js中的形参实参不匹配不会报错function func7(a,b,c=3){ console.log(a,b,c);}func7(10,11);func7(10,11,12);func7(10,11,12,13);参数写多了也不报错
只能按位置参数处理,不能用关键字传参
console.log("")8.arguments 自动收集所有的实参,是个数组
// 计算任意个数值的累加和;function func8() { // console.log(a,b) // console.log(arguments) var total = 0; for(var i of arguments){ total += i; console.log(i); } return total;}res = func8(1,100,2,3,4,5,56,6);console.log(res);收集所有实参,不管有没定义形参,都收集
遍历出参数,计算出参数计算结果
控制台打印
3.函数调用
在JavaScript中,常见的有四种不同的方式进行函数调用:
1.作为一个函数进行调用,这是最简单的形式。
2.作为一个方法进行调用,在对象上进行调用,支持面向对象编程。
3.作为构造器进行调用,创建一个新对象。
4.通过apply() 或call() 方法进行调用。
函数的调用 function func(){ console.log("函数正在执行 ... "); } // 1.正常调用 func(); // 2.函数的立即执行,不用手动调用 (function func2(){ console.log("函数正在执行2 ... ") })(); // 3.匿名函数的立即执行 (function(){ console.log("匿名函数正在执行3 ... ") })(); // 4.其他立即执行的方法; !function(){ console.log("我在执行4 ... "); }(); ~function(){ console.log("我在执行5 ... "); }();