JS---函数的声明、调用及作用域

最新推荐文章于 2023-04-20 10:59:51 发布
最新推荐文章于 2023-04-20 10:59:51 发布
阅读量143 收藏
点赞数
文章标签： javascript webview elementui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_48678713/article/details/124849654
版权
  • 函数声明及调用
<!DOCTYPE html>
<html lang="zn-CH">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
</body>
</html>
<script>
    //函数的声明
    function fun01(){
        document.write("我在山里");
    }
    //函数的调用
    fun01();
</script>

 声明式函数

<!DOCTYPE html>
<html lang="zn-CH">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
</body>
</html>
<script>
    //函数的声明
    function fun01(){
        document.write("我在山里<br>");
    }
    //函数的调用
    fun01();
    //声明式函数
    let fun02 = function(){
        document.write("你在湖里<br>");
    }
    fun02();
</script>

 箭头函数

<!DOCTYPE html>
<html lang="zn-CH">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
</body>
</html>
<script>
    //函数的声明
    function fun01(){
        document.write("我在山里<br>");
    }
    //函数的调用
    fun01();
    //声明式函数
    let fun02 = function(){
        document.write("你在湖里<br>");
    }
    fun02();
    // 箭头函数
    let fun03 = () => {
        document.writeln("爱却在云里<br>");
    };
    fun03();
</script>

 含参函数

<!DOCTYPE html>
<html lang="zn-CH">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
</body>
</html>
<script>
    //带参函数
   function fun01(age){
    document.write("我的年龄是" + age);
   }
   //调用
   fun01(18);
</script>

<!DOCTYPE html>
<html lang="zn-CH">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

</body>

</html>
<script>
    let fun01 = function (age) {
        document.writeln('age >>> ' + age + '<br>');
    }
    fun01('18');
    let fun02 = (gender) => {
        document.writeln('gender >>> ' + gender + '<br>');
    }
    fun02('男');
</script>

 

 有返回值的函数

<!DOCTYPE html>
<html lang="zn-CH">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
</body>
</html>
<script>
    //有返回值的函数
    function fun01(age) {
        return "我的年龄是>>>" + age;
    }
    let fun = fun01("18");
    document.writeln(fun + '<br>');
</script>

 

 立即执行的函数

<!DOCTYPE html>
<html lang="zn-CH">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
</body>
</html>
<script>
  function fun(){
      document.write("我在山里，你在湖里，爱却在云里" + "<br>");
  }
  fun();
  //立即执行函数的方法    使用 ! 、+ 、- 等运算符
  // -------方法一------
  !function fun01(){
      document.write("我在山里，你在湖里，爱却在云里" + "<br>");
  }();
  // -------方法二------
  (function fun02(){
      document.write("我在山里，你在湖里，爱却在云里" + "<br>");
  })();
  // -------方法三------
  (function fun(){
      document.write("我在山里，你在湖里，爱却在云里" + "<br>");
  }())
</script>

  •  函数的作用域
<!DOCTYPE html>
<html lang="zn-CH">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>
<script>
    fun01();
    function fun01(){
        document.write("秋水共长天一色");
    }

    fun02();
    let fun02 = function(){
        document.write('<h1>我爱你中国</h1>');
    };
</script>

 

 函数fun02在调用时会报错    Cannot access 'fun02' before initialization  不能正常使用

let   var   区别

<!DOCTYPE html>
<html lang="zn-CH">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
</html>
<script>
    for (let index = 0; index < 5; index++) {
        var a = index;
        let b = index;
        c = index;
    }
    console.log("a的值为" + a);
    console.log("c的值为" + c);
    console.log("b的值为" + b);  // Uncaught ReferenceError: b is not defined 
</script>

 

var  是成员变量    let  是局部变量   当声明变量 没有使用 let 或 var 修饰的时候 默认隐含是 var修饰该变量    因此a  c  的值能正常显示   b会报错

DW超
关注
Vue 3-计算属性的getter,setter
Lin16819的博客
09-17 876
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-...
理解js中声明的作用域
titoni_yunruohan的博客
12-21 202
一、首先我们了解一下作用域的分类 全局作用域：全局作用域是未定义在某个函数内的 函数作用域：局部作用域是定义在某个函数内的 二、通过实例理解作用域中的声明 例子一：代码中a、b、c和f1均为全局作用域中声明，我们可以将全局理解为一级作用域，全局作用域中声明的函数为二级作用域，函数中的函数称为三级作用域，以此类推，级数大的可以访问级数小的 <script> var a = 1 let b = 2 const c = 3 function f1() { let d = 4 r
JavaScript获取图片的原始尺寸
冷江
03-25 573
原文地址 页面里的img元素，想要获取它的原始尺寸，以宽度为例可能首先想到的就是width，如下 1 2 3 4 5 <img src="http://img11.360buyimg.com/da/g14/M07/01/0E/rBEhVlNhh8wIAAAAAADmFBLo1twAAM26gOmCgYAAOYs7
js获取图片原始大小
weixin_33920401的博客
11-06 93
摘要： 　　浏览器中显示的图片大小未必是他真实的高和宽，比如像下面这样，我们给他加上宽和高的样式 &lt;img src="IE.png" style="width:25px;height:25px;"&gt; 　　这样在浏览器中显示的大小就是25px。那么我们如何获取图片的真实大小呢？，下面的代码就实现了这个功能 1 &lt;!DOCTYPE html&gt; 2 &l...
js(jquery)绑定点击事件
热门推荐
美丽的泡沫
07-22 2万+
test 第一种 $("#test").click(function(event) { /* Act on the event */}); 第二种 document.getElementById('#foo').addEventListener('click', function() { /* Act on the event */}, false); 第三种 html
JavaScript中的声明、作用域、构造函数
weixin_54835055的博客
05-14 195
JavaScript中的声明、作用域、构造函数 一、声明提前 （1）变量的声明提前： 使用var关键字声明的变量，在所有的代码执行之前被声明（但不赋值） 如果声明变量时，不使用var关键字，则变量不会被声明提前 （2）函数的声明提前： 通过函数声明形式创建的函数function（）{}，它会在所有的代码执行前被创建，所以我们在函数声明前来调用函数；通过函数表达创建的 函数不被声明提前 在函数作用域中也有声明提前的特性，函数声明也会在函数中所...
js-callgraph:为JavaScript和Typescript构造近似的静态调用图
05-11
更复杂的作用域 部分更新到大型调用图 表示呼叫图的统一JSON格式 更灵活的CLI 取得目录参数 支持通过正则表达式过滤文件 Vue.js支持（.vue文件） 更多测试 入门（CLI） npm install -g @persper/js-callgraph js...
浅谈JavaScript的函数及作用域
11-28
（一）JavaScript函数 函数在JavaScript中扮演着至关重要的角色，它们是可重用的代码块，允许我们将一组操作封装起来，以便在需要时调用。函数主要有两种创建方式： 1. **函数声明**： ```javascript function ...
JS-函数（调用返回值）-形参实参-作用域
weixin_57218747的博客
05-07 744
JS- 函数-形参实参-作用域 1 回顾 数组 1. 什么是数组 值的有序集合 数组中的每个成员称之为元素 元素具有位置，称之为索引 索引从 0 开始，必须是连续的 2. 声明数组三种方式 ① 数组直接量 [] ② Array() 函数 ③ Array() 构造函数 3. 数组元素的读写 [] 和 索引 4. 稀疏数组 5. 遍历数组 6. 数组元素的添加和删除 6.1 添加数组元素 ① 指定下一个索引，利用 length
使用js获取图片原始尺寸
10-25
本文给大家推荐的是一个使用js获取图片的原始尺寸的例子，从本人项目中抠出来的，这里奉献给大家，有需要的直接拿走。
JavaScript给按钮绑定点击事件（onclick）的方法
10-24
主要介绍了JavaScript给按钮绑定点击事件（onclick）的方法,涉及javascript绑定onclick的基本技巧,非常具有实用价值,需要的朋友可以参考下
javascript 函数及作用域总结介绍
10-26
本文将对JavaScript中的函数和作用域进行详细介绍，包括函数的声明、作用域的规则以及它们在实际开发中的应用。 首先，需要明确的是在JavaScript中函数的三种声明方式：函数声明式、函数表达式以及使用Function构造...
js-作用域-变量申明提升 - 甘劭 - 博客园1
08-04
JavaScript中的作用域和变量声明提升是理解JS代码执行的关键概念。首先，作用域是指变量或函数可以在哪些区域中被访问的限制。JavaScript主要有两种作用域：全局作用域和函数作用域，而没有像C#、C、Java那样的块级...
JS获取图片原始尺寸
最新发布
m0_73089846的博客
04-20 589
获取图片原始宽高
JS 获取图片的原始尺寸
qq_43248623的博客
04-11 452
JS 获取图片的原始尺寸
vue项目-注册校验,校验密码长度不能小于8位且不能大于20位字符,必须包含大写字母、小写字母、数字和特殊符号
ccyolo的博客
09-21 3573
vue,注册校验,校验密码长度不能小于8位且不能大于20位字符,必须包含大写字母、小写字母、数字和特殊符号
【js】获取图片原始尺寸、判断图片是否加载完成
星辰的笔记
01-22 459
获取图片原始尺寸 var img = document.getElementById("#img"); console.log(img.naturalWidth) //获取图片原始宽 console.log(img.naturalHeight) //获取图片原始高 //适用于现代浏览器 判断图片是否加载完成 1，load事件 var img = document.getElement...
JavaScript函数详解：作用域、调用规则与声明方法
JavaScript函数及其作用域是编程中至关重要的概念，本文将为您详细介绍JavaScript中函数的声明、调用以及作用域规则。首先，让我们了解三个关键点： 1. **函数的作用域**： - 当函数被调用时，它会运行在其声明时...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值