es5

ES6也出来有一会时间了，他新增的语法糖也的确大大提高了开发者的效率，今天就总结一些自己用到最多的。 说到ES6肯定是先介绍 Babel 了，据阮一峰老师介绍到，Babel是一个广泛使用的转码器，可以将ES6代码转为ES5代码，从而在现有环境执行。这意味着，你可以现在就用ES6编写程序，而不用担心现有环境是否支持。 一、 Babel Babel的配置文件是 .babelrc ，存放在项目的根目录下。使用Babel的第一步，就是配置这个文件。 该文件用来设置转码规则和插件，基本格式如下。 { "presets": [], "plugins": [] } presets 字段设定转码规则，官方提供以下的规则集，你可以根据需要安装。 # ES2015转码规则 $ npm install --save-dev babel-preset-es2015 # react转码规则 $ npm install --save-dev babel-preset-react # ES7不同阶段语法提案的转码规则（共有4个阶段），选装一个 $ npm install --save-dev babel-preset-stage-0 $ npm install --save-dev babel-preset-stage-1 $ npm install --save-dev babel-preset-stage

最近公司在招外面包，面试也是一项体力活，得所有的问题梳理一遍。你得理解更深入，希望能和被面试者一起探讨问题，通过面试能学到一些知识，疫情时期，招人不易，找工作也不容易呀！也是查了很多资料，若有整理不对之处欢迎纠正！ES5有几种方式可以实现继承？分别有哪些优缺点？1. 原型链继承 原型链继承的基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法。 原型链继承 function People() { this.name = 'sophia'; this.hobbies=['swimming', 'skiing'] } People.prototype.getName = function () { return this.name; }; function Man() { this.sex = 'male' } Man.prototype = new People(); Man.prototype.getSex = function(){ return this.sex } Man.prototype.constructor = Man; let person1 = new Man(); person1.hobbies.push('basketball') console.log(1101, person1) console.log(11, person1.getName()

以下是ES6排名前十的最佳特性列表（排名不分先后）： Default Parameters（默认参数） in ES6 Template Literals （模板文本）in ES6 Multi-line Strings （多行字符串）in ES6 Destructuring Assignment （解构赋值）in ES6 Enhanced Object Literals （增强的对象文本）in ES6 Arrow Functions （箭头函数）in ES6 Promises in ES6 Block-Scoped Constructs Let and Const（块作用域构造Let and Const） Classes（类） in ES6 Modules（模块） in ES6 声明：这些列表仅是个人主观意见。它绝不是为了削弱ES6其它功能，这里只列出了10条比较常用的特性。 1.Default Parameters（默认参数） in ES6 还记得我们以前不得不通过下面方式来定义默认参数： 1 var link = function (height, color, url) { 2 var height = height || 50; 3 var color = color || 'red'; 4 var url = url || 'http://azat.co'; 5 ... 6

之前写过es5的组件（忘得差不多了...瞄一眼还是能拾起来的），后来学习es6的时候也写过，今天把它记下来。 es5的基本写法如下： function dialog(){ this.settings = { x: '', y: '', success: function (data) {} // 设置返回函数 // 这里设置需要传递的参数 } } // 初始化 dialog.prototype.init = function(opt){ extend( this.settings,opt); this.creatEl(); this.doSomething(); }; //相关的功能函数 dialog.prototype.doSomething = function(){ ... return this.settings.success(data); }; dialog.prototype.creatEl = function(){ ... }; function extend(obj1,obj2){ for(var attr in obj2){ obj1[attr] = obj2[attr]; } } 使用： html <div id="btn1" style="width: 80px; height: 30px; text-align: center; line-height:

ECMAScript 6（以下简称ES6）是JavaScript语言的下一代标准，已经在2015年6月正式发布了。它的目标，是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语言。 标准的制定者有计划，以后每年发布一次标准，使用年份作为标准的版本。因为当前版本的ES6是在2015年发布的，所以又称ECMAScript 2015。也就是说，ES6就是ES2015，下一年应该会发布小幅修订的ES2016。 ECMAScript和JavaScript的关系 一个常见的问题是，ECMAScript和JavaScript到底是什么关系？ 要讲清楚这个问题，需要回顾历史。1996年11月，JavaScript的创造者Netscape公司，决定将JavaScript提交给国际标准化组织ECMA，希望这种语言能够成为国际标准。次年，ECMA发布262号标准文件（ECMA-262）的第一版，规定了浏览器脚本语言的标准，并将这种语言称为ECMAScript，这个版本就是1.0版。 该标准从一开始就是针对JavaScript语言制定的，但是之所以不叫JavaScript，有两个原因。一是商标，Java是Sun公司的商标，根据授权协议，只有Netscape公司可以合法地使用JavaScript这个名字，且JavaScript本身也已经被Netscape公司注册为商标

概述 本篇为《React Native之React速学教程》的最后一篇。本篇将带着大家一起认识ES6，学习在开发中常用的一些ES6的新特性，以及ES6与ES5的区别，解决大家在学习React /React Native过程中对于ES6与ES5的一些困惑。 ES6的特性 何为ES6？ ES6全称ECMAScript 6.0，ES6于2015年6月17日发布，ECMAScript是ECMA制定的标准化脚本语言。目前JavaScript使用的ECMAScript版本为ECMAScript-262。 下面我为大家列举了ES6新特性中对我们开发影响比较大的六方面的特性。 1.类（class） 对熟悉Java，object-c，c#等纯面向对象语言的开发者来说，都会对class有一种特殊的情怀。ES6 引入了class（类），让JavaScript的面向对象编程变得更加简单和易于理解。 class Animal { // 构造方法，实例化的时候将会被调用，如果不指定，那么会有一个不带参数的默认构造函数. constructor(name,color) { this.name = name; this.color = color; } // toString 是原型对象上的属性 toString() { console.log('name:' + this.name + ',color:' +

ES6 简介 ECMAScript 6 简称 ES6，是 JavaScript 语言的下一代标准，已经在2015年6月正式发布了。它的目标是使得 JavaScript 语言可以用来编写复杂的大型应用程序，成为企业级开发语言。 ECMAScript 和 JavaScript 的关系：前者是后者的语法规格，后者是前者的一种实现 Babel：将ES6代码转为ES5代码 http://babeljs.io/ 新特性 1. let、const let 定义的变量不会被变量提升，const 定义的常量不能被修改，let 和 const 都是块级作用域 ES6前，js 是没有块级作用域 {} 的概念的。（有函数作用域、全局作用域、eval作用域） ES6后，let 和 const 的出现，js 也有了块级作用域的概念，前端的知识是日新月异的~ 变量提升：在ES6以前，var关键字声明变量。无论声明在何处，都会被视为声明在函数的最顶部；不在函数内即在全局作用域的最顶部。这样就会引起一些误解。例如： console.log(a); // undefined var a = 'hello'; # 上面的代码相当于 var a; console.log(a); a = 'hello'; # 而 let 就不会被变量提升 console.log(a); // a is not defined let a

arrow functions （箭头函数） 函数的快捷写法。不需要 function 关键字来创建函数，省略 return 关键字，继承当前上下文的 this 关键字 // ES5 var arr1 = [1, 2, 3]; var newArr1 = arr1.map(function(x) { return x + 1; }); // ES6 let arr2 = [1, 2, 3]; let newArr2 = arr2.map((x) => { x + 1 }); 注意：当你的函数有且仅有一个参数的时候，是可以省略掉括号的；当函数中有且仅有一个表达式的时候可以省略{} let arr2 = [1, 2, 3]; let newArr2 = arr2.map(x => x + 1); JavaScript语言的this对象一直是一比较麻烦的问题，运行上面的代码会报错，这是因为setTimeout中的this指向的是全局对象。 class Animal { constructor() { this.type = 'animal'; } says(say) { setTimeout(function() { console.log(this.type + ' says ' + say); }, 1000); } } var animal = new Animal();

一、在没有IDE情况下的转换 在"我的电脑->D盘”新建个文件夹es6，文件夹里新建一个文件es6.js。 打开命令行窗口 1、先全局安装babel-cli,输入命令 npm install babel-cli -g 2、输入 cd d:\es6 ; ---进入文件夹路径 3、输入 npm init ； 一路回车键 ---（引导你创建一个package.json文件，包括名称、版本、作者这些信息等） 4、输入 npm install --save-dev babel-cli ； ---（安装命令行转码babel-cli工具） 5、es6文件里新建配置文件.babelrc 复制代码 { "presets": [], "plugins": [] } 粘贴到.babelrc 里 6、命令行窗口输入 npm install --save-dev babel-preset-es2015 ；---（安装es2015依赖项） 将"es2015"加入.babelrc { "presets": [ "es2015" ], "plugins": [] } 7、输入 babel -h 检测是否安装成功 8、将es6编译成es5 例如： babel es6.js -o es5.js 二、WebStorm中es6到es5的自动转换设置 babel及es2015安装同上，即按照上面1-7的步骤执行即可

1. arr.push() 从后面添加元素，添加一个或多个，返回值为添加完后的数组长度 1 let arr = [1,2,3,4,5] 2 console.log(arr.push(6,7)) // 7 3 console.log(arr) // [1,2,3,4,5,6,7] 2. arr.pop() 从后面删除元素，只能是一个，返回值是删除的元素 1 let arr = [1,2,3,4,5] 2 console.log(arr.pop()) // 5 3 console.log(arr) // [1,2,3,4] 3. arr.shift() 从前面删除元素，只能是一个，返回值是删除的元素 1 let arr = [1,2,3,4,5] 2 console.log(arr.shift()) // 1 3 console.log(arr) // [2,3,4,5] 4. arr.unshift() 从前面添加元素，添加一个或多个，返回值是添加完后的数组的长度 1 let arr = [1,2,3,4,5] 2 console.log(arr.unshift(6,7)) // 7 3 console.log(arr) // [6,7,1,2,3,4,5] 5. arr.splice(index,num) 删除从index（索引值）开始之后的那num个元素，返回值是删除的元素数组