ES6语法:函数新特性(一)
ES6 函数
引言:
函数在任何语言中偶读很重要,java里面的函数通常叫做方法,其实是一个东西,使用函数可以简化更多的代码,代码结构看着更加清晰。今天我们来学学ES6语法中,函数有什么变化。
虽然现在的有比ES6更高的版本,但是主流一般都是ES6。es6中的函数相对于之前的版本提升了很多,相对来说在某些特定条件下,用新的函数很方便,也更简洁,功能性更加强大。
1.带参数默认值的函数。
我们都知道js是弱类型语言,不知道你有没有试过,或者学到过,js的函数声明过后,在调用这个函数的时候可以忽略这个函数所带的参数,就是说,声明的这个函数原本是带有参数的,但是呢,我在调用的时候是不需要传参的,这样也不会报错,而那些参数会有一个默认的值。来看看代码。
function testParameter(parameter1,parameter2){
console.log(parameter1);
console.log(parameter2);
}
testParameter();
这个是可以运行的,不会报错的,结果是什么呢?两个都是undefined。这就是弱类型语言的特点之一,与java不同,java会强制要求你输入参数。
一般来说,我们在实际项目中,如果有这种用法的话,这些参数都是有用的也就是需要参数有一个默认值。在es6之前,如果没有传参数,而且这个参数又是需要用到的,需要一个默认值,我们都需要自己判断这个参数是不是undefined,然后给这个参数设置默认值。这样自己写代码就比较麻烦。因此在es6的时候,函数可以这样声明,给函数的参数设置一个默认值。
function defaultParameter(parameter1,parameter2=30){
console.log(parameter1);
console.log(parameter2);
}
defaultParameter();
这样我们就给parameter2设置了一个默认的值为30,parameter1还是为undefined,虽然这种函数调用可以不传参数,我建议这个时候,这个没有设置默认值的参数还是尽量要传。参数的类型可以是任意类型,可以是字符串,数字,函数,对象,都可以设置一个默认的值。
还有一种情况,
如下:
function defaultParameter1(parameter1="这是第一个参数",parameter2){
return parameter1+parameter2;
}
console.log(defaultParameter1());
这段代码打印出来的是“这是第一个参数undefined”,然后我们传一个参数。
function defaultParameter1(parameter1="这是第一个参数",parameter2){
return parameter1+parameter2;
}
console.log(defaultParameter1(20));
你猜现在的结果是什么?你可能会说"20undefined",但是结果真不是这个,结果是"NaN",为什么?,仔细的同学就发现了,我们传的是一个20,而不是“20”,这个数字20和undefined相加的结果就成了NaN。当我们传“20”的时候,答案就是“20undefined”,但是我想说的是,如果这时我不想传第一个值怎么办,我想穿第二个值。往下看。
function defaultParameter1(parameter1="这是第一个参数",parameter2){
return parameter1+parameter2;
}
console.log(defaultParameter1(undefined,"这是第二个参数"));
把第一个参数设置成undefined就行了,并且只有设置成undefined才能使用默认的第一个参数,然后顺利给第二个值设置参数值。
2.参数默认值为表达式的函数。
前面说了带有默认值参数的函数,这节就为你带来,参数是表达式
来来来看代码
function expression(name,address=getStr()){
console.log(name+address);
}
function getStr(){
return "全栈学习笔记!"
}
expression("wx search");
这样也是可行的,结果你懂的,哈哈,如果你觉得能学到不少知识,就试试这个结果,精彩美文每天为你推送!
这里其实有一个有趣的,看下面;
function expression(name,address=name){
console.log(name+address);
}
function getStr(){
return "全栈学习笔记!"
}
expression("全栈学习笔记");
这样也是可以的,结果就是会打印出来两个“全栈学习笔记”,然后看看这个
function expression(name=address,address){
console.log(name+address);
}
function getStr(){
return "全栈学习笔记!"
}
expression(undefined,"全栈学习笔记");
我们将这个接收表达式的参数放在前面,就是相当于上面哪一种情况反过来,这样是不行的哦!
这一期的函数知识就分享到这,下一期将继续分享函数这一块的知识!如果你发现文中有什么错误或者对我有什么建议可以私信我哦!
ES6语法:函数新特性(一)的更多相关文章
- ES6语法的新特性
ES6 就是ECMAScript 6是新版本JavaScript语言的标准.虽然目前已经更新到ES7,但是很多浏览器还不知处ES7语法,该标准仍在更新中,但目前部门网站都指出ES6的语法.目前ES6也 ...
- 简单理解ECMAScript2015中的箭头函数新特性
箭头函数(Arrow functions),是ECMAScript2015中新加的特性,它的产生,主要有以下两个原因:一是使得函数表达式(匿名函数)有更简洁的语法,二是它拥有词法作用域的this值,也 ...
- ES6(函数新增特性)
ES6(函数新增特性) 1.函数参数默认值 没有 y 时,默认就是world 有 y 时,输出值即可 (错误) (C有默认值,正确) 默认值后面不能再有没有默认值的变量 2.作用域 y 取其前面的 x ...
- ES6 主要的新特性
本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用. ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony( ...
- 深入浅出:了解JavaScript的ES6、ES7新特性
参照阮一峰博客:http://es6.ruanyifeng.com/#README es6常见题:https://blog.csdn.net/qq_39207948/article/details/8 ...
- 前端笔记之ES678&Webpack&Babel(中)对象|字符串|数组的扩展&函数新特性&类
一.对象的扩展 1.1对象属性名表达式 ES6可以在JSON中使用[]包裹一个key的名字.此时这个key将用表达式作为属性名(被当做变量求值),这个key值必须是字符串. var a = 'name ...
- ES6的十个新特性
这里只讲 ES6比较突出的特性,因为只能挑出十个,所以其他特性请参考官方文档: /** * Created by zhangsong on 16/5/20. */// ***********Nu ...
- ES6中常用新特性讲解
1.不一样的变量声明:const和let ES6推荐使用let声明局部变量,相比之前的var(无论声明在何处,都会被视为声明在函数的最顶部) let和var声明的区别: var x = '全局变量'; ...
- 2.ES6引进的新特性——类Class
为什么? ES6中引入了类,类在java/c++等面向对象的编程语言常见,JS引入类是为了在日后使用js开发大型的应用程序,类本质是语法糖(语法上更加人性化) 以前写一个类 function User ...
随机推荐
- 移动端flex布局
移动端flex布局 弹性盒布局语法分为两部分: 1. 添加在父容器上的语法 (1)display : flex; 设置为弹性盒(父元素添加) (2)flex-direction: 主轴排列方式 row ...
- 车道线检测LaneNet
LaneNet LanNet Segmentation branch 完成语义分割,即判断出像素属于车道or背景 Embedding branch 完成像素的向量表示,用于后续聚类,以完成实例分割 H ...
- post请求与get请求的差别
幂等的概念 在理解这两者的区别前需要先了解的概念: 幂等性在编程中一个幂等操作的特点是其任意多次执行所产生的影响均与一次执行的影响相同.简单的说就是,浏览器发起一次请求和多次请求,不会改变目标资源的状 ...
- 前端每日实战:70# 视频演示如何用纯 CSS 创作一只徘徊的果冻怪兽
效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/VdOKQG 可交互视频 此视频是可 ...
- 用mpvue写个玩意儿玩玩
下周公司要搞黑客马拉松了,组里可能会做个小程序.然后看到了mpvue感觉还不错,于是就打算试试水.用vue写小程序听上去美滋滋.那么先开始吧! 全局安装 vue-cli $ npm install - ...
- Xml反序列化记录
1.概述 公司项目遇到一个需要对接webservice的,webservice大部分用的都是xml来传输的,这里记录一下xml反序列化遇到的问题 2.xml工具类 xml序列化: public sta ...
- Android模拟器不能上网的解决方法
我原来一直不用Android的模拟器,因为这东西的多年前的印象真的是很糟糕——启动半个小时,不支持OpenGL.即使后来有了x86镜像,在HAXM的支持下快的飞起,也不想用,因为NDK还要编译x86的 ...
- 025.掌握Service-SVC基础使用
一 Service简介 1.1 Service概念 Service是Kubernetes的核心概念,通过创建Service,可以为一组具有相同功能的容器应用提供一个统一的入口地址,并且将请求负载分发到 ...
- AlphaGo、人工智能、深度学习解读以及应用
经过比拼,AlphaGo最终还是胜出,创造了人机大战历史上的一个新的里程碑.几乎所有的人都在谈论这件事情,这使得把“人工智能”.“深度学习”的热潮推向了新的一个高潮.AlphaGo就像科幻电影里具有人 ...
- ggplot2(6) 标度、坐标轴和图例
6.1 简介 标度控制着数据到图形属性的映射.标度将我们的数据转化为视觉上可以感知的东西:例如大小.颜色.位置和形状.标度也为我们提供了读图时所使用的工具:坐标轴和图例. 执行标度的过程分为三步:变换 ...