从零开始学 Web 之 JavaScript(三)函数
大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程。此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注。在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识点,期间也会分享一些好玩的项目。现在就让我们一起进入 Web 前端学习的冒险之旅吧!
一、函数
1、函数的定义
// 第一种 function fn1(){ console.log("我是第一种定义方法!"); } // 第二种 var fn2 = function (){ console.log("我是第二种定义方法!"); }; // 注意分号 function (){ console.log("我是第二种定义方法!"); }(); // 第二种方式的调用方式之一:函数的自调用 //第三种 var fn3 = new Function("console.log('我是第三种定义方法!')");
第一种:(函数的声明)第一种定义方法最强大,定义完毕后,在哪里使用都可以,无位置限制。
第二种:(函数表达式:匿名函数) 后两种定义方法是有局限性的。(使用函数必须在定义函数之后)
2、函数的调用
函数名();
3、函数名
- 要遵循驼峰命名法。
- 不能同名(函数重载),否则后面的函数会覆盖前面的函数。
//打印函数名,就等于打印整个函数。 console.log(fn); //打印执行函数,就等于打印函数的返回值。 console.log(fn());
4、形参和实参
- 形参不需要写 var.
- 形参的个数和实参的个数可以不一致 。
5、返回值
- 如果函数没有显示的使用 return 语句 ,那么函数有默认的返回值:undefined
- 如果函数使用 return 语句,但是 return 后面没有任何值,那么函数的返回值也是:undefined.
6、变量和作用域
全局变量:在 script 使用 var 定义的变量(所有的 script 共享其全局性,js 里面没有块级作用域概念,只有全局作用域和局部作用域)。
隐式全局变量:在 script 没有 var 的变量。
function fn(){ var a = b = c = 1; // b和c就是隐式全局变量(等号) var a = 1; b = 2; c = 3; // b和c就是隐式全局变量(分号) var a = 1 , b = 2 , c = 3; // b和c就不是隐式全局变量(逗号) }
(全局变量是不能被删除的,隐式全局变量是可以被删除的)
var num1 = 10; num = 20; delete num1; delete num2; console.log(typeof num1); // number console.log(typeof num2); // undefined
局部变量:函数内部用 var 定义的变量和形参。
6.1、变量声明提升(预解析)
作用:查看语法错误。js的解析器在页面加载的时候,首先检查页面上的语法错误。把变量声明提升起来。(变量声明提升和函数整体提升)
6.2、变量的提升
只提升变量名,不提升变量值。
consolas.log(aaa);// 打印的结果是 undefined ,因为只提升变量名,不提升变量值。 var aaa = 111;
在函数范围内,照样适用。
6.3、函数的提升
function 直接定义的方法:整体提升(上面说的第一种函数定义的方法).
fn(); var aaa = 111; function fn(){ //变量声明提升在函数内部照样实用。 //函数的就近原则(局部变量作用域),打印的aaa不是111,而是 undefined。 console.log(aaa); // undefined var aaa = 222; }
预解析会分块:
多对的 script 标签中函数重名的话,预解析不会冲突。也就是预解析的作用域是每一个的 script 标签。
var先提升,function再提升:
示例:
console.log(a); // 输出a函数体 function a() { console.log("aaaaa"); } var a = 1; console.log(a); // 输出1
打印第一个结果的时候,var会提升,之后 function 再提升,但是函数a和变量a重名,function的a在后面覆盖掉变量a,所以第一个输出 a 函数体.
第二个前面var a = 1;提升之后,这个位置就相当于只有 a = 1; 赋值,所以第二个打印1.
6.4、匿名函数
作用大致如下:
//1.直接调用 (function (){ console.log(1); })(); //2.绑定事件 document.onclick = function () { alert(1); } //3.定时器 setInterval(function () { console.log(444); },1000);
低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。
持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。
转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。
- 上一篇
Python学习-基础知识-2
目录 Python基础知识2 一、二进制 二、文字编码-基础 为什么要有文字编码? 有哪些编码格式? 如何解决不同国家不兼容的编码格式? unicode编码格式的缺点 如何既能全球通用还可以规避unicode的缺点? python3的编码格式是什么样的? 三、浮点数 四、列表 如何理解列表? 列表的操作有哪些? 深浅复制问题 五、字符串 什么是字符串? 字符串的常用方法 使用r取消字符串转义 六、元组 元组和列表有什么区别? 七、哈希 八、字典 什么是字典? 字典常用操作 九、集合 什么是集合? 集合基本操作 集合分类计算 十、文件编码--进阶 十一、几个技术问题 if 条件语句判断 字典的两种循环方法对比 while...else... Python基础知识2 标签:python 目录: 一、二进制 计算机内部使用二进制表示数据。1位二进制可以代表2种状态,n位二进制可以表示2^n种状态,一般使用如下图示来计算一个字节的二进制和十进制互转: 128 64 32 16 8 4 2 1 256 1 1 1 1 1 1 1 1 78 0 1 0 0 1 1 1 0 33 0 0 1 0 0...
- 下一篇
JSP+Servlet实现购物车功能
最近期末的JSP要交大作业,我选择的是做一个在线购物书店,实现登陆注册购物车结算的功能。 一.项目总览以及使用的JS组件框架: 捕获.JPG 根据项目结构 知道用的是DAO设计模式,然后使用了 JS组件库SUI,然后看看项目完成以后大概是这样. 引导页 引导页.gif 注册 注册.gif 登陆 登陆.gif 图书列表 图书列表 (1).gif 图书详情以及购物车 图书详情以及购物车.gif 结算 结算.gif 二.数据库设计以及代码实现 user_profile表:实现登陆注册 user_profile表.JPG book_details表:实现图书列表以及图书详情 book_details表.JPG payment表:实现结算 payment表.JPG 然后是代码:首先是根据数据库表生成的实体类: UserProfile: /* * To change this license header, choose License Headers in Project Properties. * To change this template file, choose Tools | Tem...
相关文章
文章评论
共有0条评论来说两句吧...
文章二维码
点击排行
推荐阅读
最新文章
- CentOS8安装Docker,最新的服务器搭配容器使用
- Docker使用Oracle官方镜像安装(12C,18C,19C)
- CentOS8编译安装MySQL8.0.19
- CentOS8,CentOS7,CentOS6编译安装Redis5.0.7
- SpringBoot2整合MyBatis,连接MySql数据库做增删改查操作
- SpringBoot2整合Redis,开启缓存,提高访问速度
- SpringBoot2配置默认Tomcat设置,开启更多高级功能
- Hadoop3单机部署,实现最简伪集群
- CentOS7,CentOS8安装Elasticsearch6.8.6
- CentOS6,7,8上安装Nginx,支持https2.0的开启