标签： es6 javascript

箭头函数

ES6为了书写方便引入了函数的全新简写方式-箭头函数

<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width">

  <title>JS Bin</title>

</head>

<body>

  <script>

    //es5完法

    var show0 = function(str){

      console.log(str);

    }

    //es6写法

    let show1 = (str)=>{

      console.log(str);

    }

    show0('这是测试0！');

    show1('这是测试1！');

  </script>

</body>

</html>

测试地址

箭头函数的一些特性

  • 当只有一个参数的时候可以省略括号
  • 当只有一个return语句的时候，大括号和return可以省略
<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width">

  <title>JS Bin</title>

</head>

<body>

  <script>

    let show0 = (str)=>{

      console.log(str);

    }

    //省略括号

    let show1 = str=>{

      console.log(str);

    }

    let show2 = (str)=>{

      return str

    }

    //省略括号与中括号和return语句

    let show3 = str=>str;

    show0('测试0！');

    show1('测试1！');

    console.log(show2('测试2！'));

    console.log(show3('测试3！'));

  </script>

</body>

</html>

测试地址

参数的变化

-参数的扩展/数组展开（...）

-默认参数

<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <meta name="viewport" content="width=device-width">

  <title>函数参数变化</title>

</head>

<body>

<script>

  //收集余下参数并展开使用，...args必须放么最后，收集余下的所有可能的参数

  function show(a,b,...args){

    console.log(a,b,...args);

  }

  show(1,2,5,6);

  //展开数组

  let arr0=[1,2,3];

  let arr1=[4,5,6];

  let arr =[...arr0,...arr1];

  console.log(arr);

  //默认参数,当b/c没有传入值时取默认值，如果有传入则取传入值

  function show0(a,b=1,c=2){

    console.log(a,b,c);

  }

  show0(0);

</script>

</body>

</html>

测试地址

粗看ES6之函数的更多相关文章

  1. 粗看ES6之数组

    标签: javascript es6 数组新增方法 map(可以理解为是映射,以一定规则修改数组每一项并返回全新数组) reduce(可以理解为是汇总,一堆出来一个) filter(可以理解为过滤,筛 ...

  2. 粗看ES6之变量

    标签: javascript var定义变量面临的问题 可以重复定义 无法限制变量不可修改 无块级作用域 ES6变量定义升级 新增let定义变量 新增const定义常量 let特性 有块级作用域 不可 ...

  3. 粗看ES6之面向对象写法

    标签: es6 在es6以前,js没有类的概念,虽然有构造函数原型的方式用来做面向对向开发,但是对于书法并不是十分友好,而且对于继承实现也不是十分友好. es6引入class constructor ...

  4. 粗看ES6之JSON

    标签: es6 ES6新增JSON特性不是特别多,只是针对JSON某些情况下的写法上有一些优化: 当key值和value值对应变量名相同时 json对像中的方法书写 示例代码如下: <!DOCT ...

  5. 粗看ES6之字符串

    标签: javascript es6 字符串新增特性 新增二个方法 - startsWith/endsWith 字符串模板 - 反单引号的应用 startsWith 判断字符串以是否以某某开头,返回一 ...

  6. 粗看ES6之解构赋值

    标签: javascript es6 什么是解构赋值? 示例如下: <!DOCTYPE html> <html> <head> <meta charset=& ...

  7. 新手必看ES6基础

    ES6 基础 一.新的变量声明方式 let/const 与var不同,新的变量声明方式带来了一些不一样的特性,其中最重要的两个特性就是提供了块级作用域与不再具备变量提升. 通过2个简单的例子来说明这两 ...

  8. ES6 — 箭头函数

    一 为什么要有箭头函数 我们在日常开发中,可能会需要写类似下面的代码 const Person = { 'name': 'little bear', 'age': 18, 'sayHello': fu ...

  9. 前端分享----JS异步编程+ES6箭头函数

    前端分享----JS异步编程+ES6箭头函数 ##概述Javascript语言的执行环境是"单线程"(single thread).所谓"单线程",就是指一次只 ...

随机推荐

  1. docker与虚拟机性能比较（转）

    http://blog.csdn.net/cbl709/article/details/43955687 本博客来源于我的个人博客: www.chenbiaolong.com 欢迎访问. 概要 doc ...

  2. linux线程池

    typedef struct task_node { void *arg; /* fun arg. */ void *(*fun) (void *); /* the real work of the ...

  3. CF709A Juicer 模拟

    Kolya is going to make fresh orange juice. He has n oranges of sizes a1, a2, ..., an. Kolya will put ...

  4. 14.链表中倒数第k个节点

    题目描述:   输入一个链表,输出该链表中倒数第k个结点. 思路分析:   设置两个指针,一个fast一个slow,都从链表头开始,让fast先走k步,然后两个指针一起走,当fast走到尾部,那么sl ...

  5. FPGA基础学习(1) -- FFT IP核（Quartus）

    为了突出重点,仅对I/O数据流为steaming的情况作简要说明,以便快速上手,有关FFT ip核模型及每种设置详细介绍请参考官方手册FFT MegaCore Function User Guide. ...

  6. vscode 注册表

    Windows Registry Editor Version 5.00 ; Open files [HKEY_CLASSES_ROOT\*\shell\Open with VS Code] @=&q ...

  7. sharepoint_study_目录学习笔记(长期更新)

    1. _catalogs/masterpage:这个是SharePoint网站的母版页样式库页面,这里放了网站上所有的母版页(网站设置--Web设计器库--母版页和页面布局). 2.  15\TEMP ...

  8. c#工具类之Int扩展类

    public static class IntHelper { /// <summary> /// 转换为2进制字符串 /// </summary> /// <param ...

  9. TXT文件导入到ORACLE数据库中

    --创建表 (sqlplus执行) drop table cjw; ),phone ),city ),born ),adressJob ),mail )); ### txt导入到oracle cat ...

  10. Gone Fishing

    原题网址 代码已经写出来了,自己测试的时候没有问题,提交上去之后反馈了我一个Runtime error  一口老血啊! 找了半天还是没找到可能越界啊啥的地方 import java.util.Scan ...