es6深入学习记录编程风格

早晨学习的地方 早晨学习的地方     2022-08-18     343

关键词:

今天学习阮一峰ES6编程风格,其中探讨了如何将ES6的新语法,运用到编码实践之中,与传统的JavaScript语法结合在一起,写出合理的、易于阅读和维护的代码。

1.块级作用域


(1)let 取代 var


  ES6 提出了两个新的声明变量的命令: letconst。其中,let 完全可以取代 var,因为两者语义相同,而且 let 没有副作用
  
  上面代码如果用 var 替代 let,实际上就声明了两个全局变量,这显然不是本意。变量应该只在其声明的代码块内有效,var 命令做不到这一点。

  var 命令存在变量提升效用,let 命令没有这个问题。
  
  上面代码如果使用var 替代 let,console.log那一行就不会报错,而是会输出undefined,因为变量声明提升到代码块的头部。这违反了变量先声明后使用的原则。

  所以,建议不再使用var命令,而是使用 let 命令取代

(2)全局常量和线程安全


  在 let 和 const 之间,建议优先使用 const,尤其是在全局环境,不应该设置变量,只应设置常量

  const 优于 let 有几个原因。一个是 const 可以提醒阅读程序的人,这个变量不应该改变;另一个是 const 比较符合函数式编程思想,运算不改变值,只是新建值,而且这样也有利于将来的分布式运;最后一个原因是 JavaScript 编译器会对 const 进行优化,所以多使用const ,有利于提供程序的运行效率,也就是说 let 和 const 的本质区别,其实是编译器内部的处理不同。
  
  const 声明常量还有两个好处,一是阅读代码的人立刻会意识到不应该修改这个值,二是防止了无意间修改变量值所导致的错误。

  所有的函数都应该设置为常量。

  长远来看,JavaScript可能会有多线程的实现,这时 let 表示的变量,只应出现在单线程运行的代码中,不能是多线程共享的,这样有利于保证线程安全

2.字符串


  静态字符串一律使用引号或印号,使用双引号。动态字符串使用反印号
  

3.解构赋值


  使用数组成员对变量赋值时,优先使用解构赋值。
  


  函数的参数如果是对象的成员,优先使用解构赋值。

  


  如果函数返回多个值优先使用对象的解构赋值,而不是数组的解构赋值。这样便于以后添加返回值,以及更改返回值的顺序。

  

总结:本文转载自阮一峰es6入门,个人学习使用,请勿转载!

js-es6学习笔记-编程风格

1、ES6提出了两个新的声明变量的命令:let和const。其中,let完全可以取代var,因为两者语义相同,而且let没有副作用。2、var命令存在变量提升效用,let命令没有这个问题。建议不再使用var命令,而是使用let命令取代。3、在let和c... 查看详情

es6-编程风格

块级作用域(1)let取代varES6提出了两个新的声明变量的命令:let和const。其中,let完全可以取代var,因为两者语义相同,而且let没有副作用。‘usestrict‘;if(true){letx=‘hello‘;}for(leti=0;i<10;i++){console.log(i);}上面代码如果用var替代l... 查看详情

es6编程风格(代码片段)

块级作用域(1)let取代varES6提出了两个新的声明变量的命令:let和const。其中,let完全可以取代var,因为两者语义相同,而且let没有副作用。‘usestrict‘;if(true)letx=‘hello‘;for(leti=0;i<10;i++)console.log(i); 上面代码如果用var替... 查看详情

es6-21:编程风格ecmascript规格

良好的代码编程习惯是一个优秀的软件工程师的必备素养,也是一个团队开发易于阅读、高可维护性的大型项目的基础;虽然Javascript弱语言的本质给前端开发者带来了更大的灵活性,但从工程的角度来说这是非常不合理的,也... 查看详情

ck2032-es6深入剖析解析彩票项目实战

CK2032-ES6深入剖析解析彩票项目实战随笔背景:在很多时候,很多入门不久的朋友都会问我:我是从其他语言转到程序开发的,有没有一些基础性的资料给我们学习学习呢,你的框架感觉一下太大了,希望有个循序渐进的教程或... 查看详情

reactredux学习笔记

ReactRouterReactRouter使用教程 Redux中间件middleware[译]深入浅出Redux中间件Redux学习之一:何为middleware? ES6ES6新特性概览 antant.design rekit 先记录两篇博文,等有时间,整理一篇 查看详情

es6学习记录

前言  由于要学习ReactNative,所以得用到ES6,故为运用ReactNative做一个铺垫 学习记录一、变量1.let   let与var作用相同,用于定义变量,但是作用域不同。不在指定的{}中定义,值就获取不到(undefined)。  let... 查看详情

学习javascript的编程风格

...ipt编程风格是什么。我非常推荐这个演讲,它不仅有助于学习Javascript,而且能让你心情舒畅,因为Crockford讲得很幽默,时不时让听众会心一笑。下面,我根据这个演讲和Crockford编写的代码规 查看详情

es6学习记录

 工具Babel,将es6转es5配置文件名称 .babelrc内容{"presets":[],"plugins":[]}npmES2015npminstall--save-devbabel-preset-es2015reactnpminstall--save-devbabel-preset-reactes7不同阶段语法提案转码4个阶段npminstall--save-devb 查看详情

todo转载es6的学习记录

粗略看了一遍React的内容,然后看了ES6的入门文章:http://es6.ruanyifeng.com/#docs/intro 通过这个链接可以查看浏览器对ES6的支持程度:http://ruanyf.github.io/es-checker/  查看详情

java学习——强调一下编程风格

讲完了Java的基础语法,大家就可以编写简单的程序代码了,这里有必要强调一下编程风格。  代码风格虽然不影响程序的运行,但对程序的可读性却非常重要。自己编写的程序要让别人看懂,首先在排版方面要非常注意... 查看详情

es6代理proxy学习

深入浅出es6里面有详细介绍代理  深入浅出es6:http://www.infoq.com/cn/es6-in-depth/以下是本人的实际测试例子。代理的基本用法。//proxy=newProxy(target,hander)  //代理调用的方法,就是调用目标对象的方法,或者是被重写的14... 查看详情

react深入学习(资料,案例)

首先推荐一本入门书籍《react引领未来的用户界面开发框架》react入门教程:React 入门实例教程- 阮一峰的网络日志:http://www.ruanyifeng.com/blog/2015/03/react.htmlgithub reactreactdevtools开发者工具下载具体的基于react+redux是基于es... 查看详情

es6再次的学习知识点记录

嵌套箭头函数前一个函数的输出是后一个函数的输入 functioninsert(value){return{into:function(array){return{after:function(afterValue){array.splice(array.indexOf(afterValue)+1,0,value);returnarray;}};}};}insert(2).into([1, 查看详情

spring万字带你深入学习面向切面编程aop(代码片段)

文章目录前言AOP简介AOP入门案例AOP工作流程AOP切入点表达式AOP通知类型AOP通知获取数据总结前言  今天我们来学习AOP,在最初我们学习Spring时说过Spring的两大特征,一个是IOC,一个是AOP,我们现在要学习的就是这个AOP。AOP简介... 查看详情

freertosfreertos学习笔记—学习freertos的编程风格和本质(代码片段)

FreeRTOS的编程风格学习一个RTOS,搞懂它的编程的风格很重要,这可以大大提供我们阅读代码的效率。下面我们就以FreeRTOS里面的数据类型、变量名、函数名和宏这几个方面做简单介绍。1、数据类型在FreeRTOS中,使用的... 查看详情

深入浅出es6:es6是什么

ECMAScript发生了什么变化?编程语言JavaScript是ECMAScript的实现和扩展,由ECMA(一个类似W3C的标准组织)参与进行标准化。ECMAScript定义了:语言语法 –语法解析规则、关键字、语句、声明、运算符等。类型 –布尔型、数字... 查看详情

ts与es6学习记录(代码片段)

ts遵循es6语法,也是js以后发展的方向,学好ts对于以后都有帮助。1.字符模板以前对这个方法认知的还是太少了,直接上代码吧。varn1=‘1‘;varn2=‘2‘;varn3=‘3‘;varfn=function()return4//这个时候函数也是可以返回的console.log(`返回$n1,$... 查看详情