es6 入门 变量,箭头函数,变量字符串拼接

ES6里面,变量表示方法不再只有var 一种,而变成了三种。

var , let, const

let 和var 的区别呢,是无法定义let 两次,但是内容还是可以换的。

这避免了不小心覆盖了变量的可能性。

let oop = ‘00p‘
oop=23;
console.log(oop); //23
____________________________
let oop = ‘00p‘
let oop=23;
console.log(oop); // SyntaxError: Identifier ‘oop‘ has already been declared

 而const ,顾名思义,可以用来定义静态变量。比如PI.

const pi = 3.414;

const pi = 0; //SyntaxError: Identifier ‘pi‘ has already been declared
//而如果用

pi = 0; //TypeError: Assignment to constant variable.

//但是有一种例外,用const 定义对象的情况下,对象属性可以被重新定义。

const loops ={p:‘lol‘,a:‘pp‘,x:‘oo0‘}

loops.x= 1 ;

console.log(loops.x);//1

  

ES6的匿名函数的表示方法,从以前的

function (){};

这种形式,变成了()=>{} ,的形式,也就是把 关键字function 变成了‘=>’还挪到了()后面。

如果只有一个参数的情况下()也可以省略。

ES6里面,不再采用之前那种 如果字符串和变量一起返回,用‘+’来拼接的形式了。

而是 采用``这个符号包围字符串和变量。用${}包裹着变量,而字符串不需要处理。

${}里面不仅仅可以包含变量还可以包含代码。

有点类似于PHP的样子。

例子:

const aArray = [‘w‘,‘b‘,‘c‘];
console.log(
`hey,${aArray.map(item =>{if(item =="c")
return`${item} is the item `}).join(‘‘)}`
)

  

  有时候,匿名函数连{}都可以不要,直接用``就可以了。

const aArray = [‘w‘,‘b‘,‘c‘];
console.log(
`hey,
${aArray
.map(item =>`${item} is there.`)
.join(‘‘)}`
)

  

  

时间: 2024-10-08 08:50:31

es6 入门 变量,箭头函数,变量字符串拼接的相关文章

es6学习笔记--箭头函数

基本用法 ES6允许使用“箭头”(=>)定义函数. var f = v => v; 上面的箭头函数等同于: var f = function(v) { return v; }; 如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分. var f = () => 5; // 等同于 var f = function () { return 5 }; var sum = (num1, num2) => num1 + num2; // 等同于 var sum = funct

阮一峰老师的ES6入门:async 函数

async 函数 1. 含义 ES2017 标准引入了 async 函数,使得异步操作变得更加方便. async 函数是什么?一句话,它就是 Generator 函数的语法糖. 前文有一个 Generator 函数,依次读取两个文件. const fs = require('fs'); const readFile = function (fileName) { return new Promise(function (resolve, reject) { fs.readFile(fileNam

从 ES6 高阶箭头函数理解函数柯里化

前言:第一次看到多个连续箭头函数是在一个 react 项目中,然鹅确认了下眼神,并不是对的人,因为看得一脸懵逼.em......于是开始各种搜索,先是知道了多个连续箭头函数就是 es6 的多次柯里化的写法,对于函数柯里化,很久以前就知道这个名次,但是并不理解,也没有去了解.为了弄明白多个连续箭头函数,开始了简化之路. 首先看到了这样的一个例子: let add = a => b => a + b 以上是一个很简单的相加函数,把它转化成 ES5 的写法如下: let add = function

ES6中的箭头函数

箭头函数内部没有constructor方法,也没有prototype,所以不支持new操作.但是它对this的处理与一般的普通函数不一样.箭头函数的 this 始终指向函数定义时的 this,而非执行时.我们通过一个例子来理解: var o = { x : 1, func : function() { console.log(this.x) }, test : function() { setTimeout(function() { this.func(); }, 100); } }; o.te

JavaScript ES6箭头函数指南

前言 胖箭头函数(Fat arrow functions),又称箭头函数,是一个来自ECMAScript 2015(又称ES6)的全新特性.有传闻说,箭头函数的语法=>,是受到了CoffeeScript 的影响,并且它与CoffeeScript中的=>语法一样,共享this上下文. 箭头函数的产生,主要由两个目的:更简洁的语法和与父作用域共享关键字this.接下来,让我们来看几个详细的例子. 新的函数语法 传统的JavaScript函数语法并没有提供任何的灵活性,每一次你需要定义一个函数时,你

ES6中箭头函数的作用

我们知道在ES6中,引入了箭头函数,其本质就是等同有ES5中的函数.类似于下面的写法: let test1=() => "abc"; let test2=() => { return "abc"}; let sum=(a,b) => a+b; 比如上面的3个ES6的箭头函数的写完,如果用ES5就像下面的写完一样. 其实其等同于下面的ES5的写法: function test1() { return "abc" } functio

关于变量、函数等的命名

自从接触前端以来,一直被一件事所困扰——取名无能.class.id.变量.函数.对象……  想名字是一件很头疼的事情.最近百度上看到一篇关于命名的一些词汇(http://www.cnblogs.com/iyueyao/p/3777678.html),可以借鉴一下. 函数命名:统一使用动词或者动词+名词形式 ---- fnInit() 如果有内部函数则“_”开头   _fnInit(). 对象方法命名使用fn+对象类名+动词+名词形式   fnAnimateDoRun()  某事件响应函数命名方式

es6之箭头函数

es6之箭头函数 es6中的箭头函数实际上是一种语法糖,使用起来会更加方便. 1. 即它允许使用箭头(=>)来定义函数. 如 var f = v =>v; 这个箭头函数就等同于: var f = function (v) { return v; }; 2. 如果不需要给这个函数传递参数,就使用圆括号来代表参数部分,如下所示: var f = () =>8; 这个箭头函数就等同于: var f = function () { return 8; }; 3.如果传入的参数多于一个,同样也需要

进阶路上有你我-相互相持篇之ES6里箭头函数里的this指向问题

首先复习下普通函数里的this指向: 1 function test(){ 2 console.log(this) 3 } 4 test() 你会秒杀的毫无疑问的回答:window,针对普通函数:谁调用了函数  函数里的this就指向谁,test()等价于window.test(),所以是window 1 var name="outername" 2 var o={ 3 name:"innername", 4 getname:function(){ 5 consol

ES6 -箭头函数 ,对象的函数解构

ES6 -箭头函数: //es6 中的箭头函数和扩展 //es5的写法 // function add(a,b){ // return a + b; // } // add(1,2); //3 function add1(a,b=1){ if(a==0){ throw new Error('a is zero'); } return a+b; } //console.log(add1(0)) //Uncaught Error: a is zero 主动抛出异常 //严谨模式 function a