JS中变量和函数的使用

一、变量的介绍

1、啥是变量?

  变量的本质是一块有名字的内存空间。变量由变量名和变量值构成。变量名指的是内存空间的别名,一般位于赋值运算符的左边;而变量值指的是内存空间中的数据,一般位于赋值运算符的右边。例如:var balance =250;其中balance为变量名,是内存空间的别名;250为变量值,为数据。

2、如何声明变量?

 暂且可将声明理解为创造,当声明变量时,使用关键字 var
 第一种:单独声明

   <script>var a = 32;  //声明一个变量,变量名为a,变量值为32;var b = 45;  //声明一个变量,变量名为b,变量值为45;</script>
复制代码

 第二种:一个var多个声明变量

<script>var a = 32,b = 45,c = 57;   //利用一个var来声明多个变量用逗号隔开var x = 123,y = 245,z = 100;  //此写法与上面意思一样写法不同而已
</script>
复制代码

 第三种:重复声明

<script>var a = 120; var a = 356;   //这些指令表明使用同一变量名声明两次,造成重复
</script>
复制代码

 第四种:遗漏声明

<script>var m = 12;var n = 32;alert(m)  //可弹出m的值,却遗漏了下面n的值
</script>
复制代码

注意细节:
  1.在JS中重复声明虽然是允许的,但在开发中,不要这样用;
  2.在JS中遗漏声明也是允许,但在实际开发时, 也是要尽量避免的;
  3.在JS中,可以通过alert(),来弹出一个变量的值。

3、声明变量的特征有?

特征1:如果仅仅是声明变量,那么变量是有默认值

<script>var a;   // 如果你仅仅是声明一个变量,并非赋值,那么它的默认值为undefinedconsole.log(a)  // 打印出a的值
</script>
复制代码

特征2:使用var 声明的变量可以进行提升,提升就是把加var的变量提前最前面

解析:JS代码在执行之前有一个预编译,预编译做了两件事:
  (1)把加var的变量提升,提升的仅仅是声明,而没有赋值部分;
  (2)把函数提升到了代码段(一个script标签就是一个代码段)的最前面。 当预解析完后,才会执行JS代码;
  (3)当函数与变量套用着,加var的变量虽然那个要提升,但由于此时的变量为局部变量,只会提升到函数体的最前面。

例1.1:<script> var a;  //此时只有声明提升到前面而变量值没有console.log(a)  // 打印出的a的值为undefinedvar a = 120;  //这一步相当于没操作 </script>
复制代码
例1.2:<script> var a;  //此时只有声明提升到前面而变量值没有console.log(a)  // 打印出的a的值为undefinedvar a = 120;  //这一步相当于没操作 console.log(a)  //打印出的a的值为120</script>
复制代码
例2:<script> g()             //调用函数function g(){console.log("g....")  //此时也可以打印出来g...,因为函数整个提升到了前面}                        //声明定义变量</script>
复制代码
例3:<script>console.log("--------------------")  //打印出----------var a;                               //这是将局部变量提升到函数体最前面function f(){console.log(a)                  //要打印时会去寻找变量,即为undefineda = 2;}f();</script>
复制代码

4、变量分为哪几类?

1.局部变量
  局部变量指在函数内声明的变量。它只能在函数内部访问,在函数外面是不能被访问;就好像是各个地方的方言一样。

例子:<script>function f(){var name = "wangcai";  //局部变量,因为这个变量放在函数里面console.log(name)}console.log("----"+name) //这里因为name是局部变量,所以只会显示----// 函数声明完后,你要使用这个函数,那么你一定要调用这个函数f()</script>
复制代码

2.全局变量
  全局指变量指在函数外声明的变量。它在函数内部和外部都可以访问;就如同标准普通话在任何地区都可以用。

例子:<script>var age = 100;  //全局变量声明定义了agefunction f(){console.log("在函数里面访问的全局变量"+age)  //这里为局部变量只有调用函数后才会打印出来}console.log(age)  //此为全局变量,在函数外声明的f() // 函数调用,这里会将函数的第二行代码执行出来</script>
复制代码

二、函数的认识

1、啥是函数?

  函数可以说成是个功能块,当你给它一个输入值时,在这个功能块中通过某种关系或者说映射,就能得到一个输出值。就像豆浆机,将准备的大豆放到机器中,通过榨汁得到一杯豆浆。

2、如何定义函数?

方式一:函数声明
  用关键字function来声明函数,其中基本格式如下:function  f(){ };其中有f为函数名;()是函数的特殊标志;{}叫函数体或者具体的功能

function  f(){console.log("函数声明")
}
复制代码

方式二:函数表达式
  函数表达式本质上是一个变量;它指的是将以function声明的函数作为表达式放在赋值的右边,重新定义一个变量。

var g = function  f(){console.log("函数表达式")
}
f();
复制代码

区别:声明函数与函数表达式两者在提升阶段不一样;函数声明可以将函数调用写到函数声明之前,而函数表达式则将函数调用提前会出错。

函数声明:
<script>f();function  f(){console.log("函数声明提升")     //此时是可以打印出"函数声明提升"}
</script>
函数表达式:
<script>f();var g = function  f(){console.log("函数表达式提升")  //会报错,f没有定义}
</script>
复制代码

3、函数返回值

1.函数在没有写return或者只写了return时,默认返回undefined。

(1) function  f(){//这是相当于默认的return undefined;}
(2)function  f(){return;  //同上,默认的return undefined;
}
复制代码

2.在一个函数中,执行过return语句后,下面的语句将不再执行。

function  f(){console.log("caomeitai")return thanks;   //当执行过该语句,下面不再执行console.log("xiaoyuzhou")  //并未执行
}
复制代码

4、函数的参数

  在函数定义与函数调用时,有两个参数:形参与实参。形参即形式参数,代表着在定义函数时,小括号中的参数;实参即实际参数则代表在调用函数时,小括号中的参数。

function  add(x,y){    //这里小括号中的x,y为形参return  x+y;
}
console.log(add(2,3));  //在调用了add函数时的2,3为实参
复制代码

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/275088.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Win32 API消息函数:GetMessagePos

Win32 API消息函数:GetMessagePos 函数功能&#xff1a;该函数返回表示屏幕坐标下光标位置的长整数值。此位置表示当上一消息由GetMessage取得时鼠标占用的点。 函数原型&#xff1a;DWORD GetMessagePos&#xff08;VOID&#xff09; 参数&#xff1a;无。 返回值&…

都快 2022 年了,这些 Github 使用技巧你都会了吗?

大家好&#xff0c;我是若川。最近组织了源码共读活动&#xff0c;感兴趣的可以点此加我微信 ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。最近经常有小伙伴问我如…

单线程+异步协程

一 . 线程池和进程池 可以适当的使用,在大量的IO情况下有更好的方法 import time from multiprocessing.dummy import Pool def request(url):print(正在下载->,url)time.sleep(2)print(下载完毕->,url) start time.time() urls [www.baidu.com,www.taobao.com,www.sou…

Repeater\DataList\GridView实现分页,数据编辑与删除

一、实现效果 1、GridView 2、DataList 3、Repeater 二、代码 1、可以去Csdn资源下载&#xff0c;包含了Norwind中文示例数据库噢&#xff01;&#xff08;放心下&#xff0c;不要资源分&#xff09; 下载地址&#xff1a;数据控件示例源码Norwind中文数据库 2、我的开发环境&a…

网站快速成型_我的老板对快速成型有什么期望?

网站快速成型Some of the top excuses I have gotten from clients when inviting them into a prototyping session are: “I am not a designer!” “I can’t draw!” “I have no creative background!”在邀请客户参加原型制作会议时&#xff0c;我从客户那里得到的一些主…

碎片化学前端,融入到积极上进的环境,我推荐~

众所周知&#xff0c;关注公众号可以了解学习掌握技术方向&#xff0c;学习优质好文&#xff0c;落实到自己项目中。还可以结交圈内好友&#xff0c;让自己融入到积极上进的技术氛围&#xff0c;促进自己的技术提升。话不多说&#xff0c;推荐这些优质前端公众号前端之神 80w阅…

重学JavaScript深入理解系列(六)

JavaScript深入理解—-闭包(Closures) 概要 本文将介绍一个在JavaScript经常会拿来讨论的话题 —— 闭包&#xff08;closure&#xff09;。闭包其实已经是个老生常谈的话题了&#xff1b; 有大量文章都介绍过闭包的内容&#xff0c;尽管如此&#xff0c;这里还是要试着从理论角…

EXT.NET复杂布局(四)——系统首页设计(上)

很久没有发帖了&#xff0c;很是惭愧&#xff0c;因此给各位使用EXT.NET的朋友献上一份礼物。 本篇主要讲述页面设计与效果&#xff0c;下篇将讲述编码并提供源码下载。 系统首页设计往往是个难点&#xff0c;因为往往要考虑以下因素&#xff1a; 重要通知系统功能菜单快捷操作…

figma设计_在Figma中使用隔片移交设计

figma设计I was quite surprised by how much the design community resonated with the concept of spacers since I published my 自从我发表论文以来&#xff0c;设计界对间隔件的概念产生了多少共鸣&#xff0c;我感到非常惊讶。 last story. It encouraged me to think m…

axios源码中的10多个工具函数,值得一学~

大家好&#xff0c;我是若川。最近组织了源码共读活动&#xff0c;感兴趣的可以点此加我微信 ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。本文来自读者Ethan01投稿…

安装jenkins时出现 No such plugin: cloudbees-folder的解决办法

今天安装了一下jenkins&#xff0c;在初始化安装插件时出现“ No such plugin: cloudbees-folder”错误&#xff0c;根据网上的教程&#xff1a; 1、打开链接“http://ftp.icm.edu.pl/packages/jenkins/plugins/cloudbees-folder/”&#xff0c;在最下面找到并打开“latest”目…

寄充气娃娃怎么寄_我如何在5小时内寄出新设计作品集

寄充气娃娃怎么寄Over the Easter break, I challenged myself to set aside an evening rethinking the structure, content and design of my portfolio in Notion with a focus on its 在复活节假期&#xff0c;我挑战自己&#xff0c;把一个晚上放在一边&#xff0c;重新思…

基于Hbase的用户评分协同过滤推荐算法

基于Hbase的用户评分协同过滤推荐算法 作者&#xff1a; 张保维 2012-1-3 一、 概述 本文为推荐引擎设计的基础篇&#xff0c;介绍基于hbase 存储方式用户评分的方式进行推荐的主体算法及在分布式平台环境下的实现。由于推荐算法分支众多&#xff0c;我们先从简单及实用的算法…

最全 JavaScript Array 方法 详解

大家好&#xff0c;我是若川。最近组织了源码共读活动&#xff0c;感兴趣的可以点此加我微信 ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。我们在日常开发中&#…

[译] React Hooks: 没有魔法,只是数组

[译] React Hooks: 没有魔法&#xff0c;只是数组 原文链接&#xff1a; medium.com/ryardley/r… 我是 React 新特性 Hooks 的粉丝。但是&#xff0c;在你使用 React Hooks的过程中&#xff0c;有一些看上去 很奇怪的限制 。在本文里&#xff0c;对于那些还在为了理解这些限制…

管理沟通中移情的应用_移情在设计中的重要性

管理沟通中移情的应用One of the most important aspects of any great design is the empathetic understanding of and connection to the user. If a design is ‘selfish’, as in when a product designed with the designer in mind and not the user, it will ultimatel…

网易前端进阶特训营,邀你免费入营!一举解决面试晋升难题!

网易等大厂的前端岗位一直紧缺&#xff0c;特别是资深级。最近一位小哥面进网易&#xff0c;定级P4&#xff08;资深&#xff09;&#xff0c;总包60W&#xff0c;给大家带来真实面经要点分享。网易的要求有&#xff1a;1.对性能优化有较好理解&#xff0c;熟悉常用调试工具2.熟…

Feign的构建过程及自定义扩展功能

spring-cloud-openfeign-core-2.1.1.RELEASE.jar 中 HystrixFeign 的详细构建过程&#xff1a; EnableFeignClients -> FeignClientsRegistrar 扫描 Feign注解的类 -> FeignClientFactoryBean通过Targeter生产FeignClient -> Targeter通过Feign.Builder构建Feign ->…

angelica类似_亲爱的当归(Angelica)是第一个让我哭泣的VR体验

angelica类似It was a night just like any other night. I finished work for the day and closed my laptop. I had dinner and after an hour, I put on my Oculus Quest headset in order to begin my VR workout.就像其他任何夜晚一样&#xff0c; 这 是一个夜晚。 我完成…

面试官:请手写一个带取消功能的延迟函数,axios 取消功能的原理是什么

大家好&#xff0c;我是若川。最近组织了源码共读活动&#xff0c;感兴趣的可以点此加我微信 ruochuan12 参与&#xff0c;每周大家一起学习200行左右的源码&#xff0c;共同进步。同时极力推荐订阅我写的《学习源码整体架构系列》 包含20余篇源码文章。本文仓库 https://githu…