ES6语法(一)
对于ES6中的一些基础语法,包括对数组/对象/函数/字符串的操作,chroem已经支持了这些语法
// var a = '你'
// console.log(a.length)
let a = 'nihao'
console.log(a)
let str = "string"
console.log(str.startsWith('i'))
{
let name = "list";
let info = "hello world";
let m = `i am ${name},${info}`;
console.log(m)
}
{
// 例如日期补0
console.log('1'.padStart(2,'0'))
console.log('1'.padEnd(2,'0'))
}
{
let user = {
name: "list",
info: "hello world"
}
console.log(abc`i am ${user.name},${user.info}`)
function abc(s,v1,v2) {
console.log(s,v1,v2);
return s + v1 + v2;
}
}
{
console.log(String.raw`hi\n${1+2}`)
console.log(`hi\n${1+2}`)
} {
console.log(Number.isFinite(15))
console.log(Number.isFinite(NaN))
console.log(Number.isFinite('true'/0))
console.log('NaN',Number.isNaN(NaN))
} {
console.log(4.1,Math.trunc(4.1)) //
console.log(4.9,Math.trunc(4.9)) //
}
{
console.log('-5',Math.sign(-5)) //-1
console.log('0',Math.sign(0)) //
console.log('5',Math.sign(5)) //
console.log('5',Math.sign('5')) //
} /*--数组扩展--*/
{
let arr = Array.of(3,4,7,9,11)
console.log(arr)
}
{
let p = document.querySelectorAll('p')
let pArr = Array.from(p)
pArr.forEach((item)=>{
console.log(item.textContent)
})
} {
// 填充数组
console.log([1,'a',undefined].fill(7))
console.log([1,'a',undefined].fill(7,1,3))//fill内参数,第一个为替换的数值,第二和第三为起止位置
} {
for (let index of ['11','22','32'].keys()) {
console.log('keys',index)//返回数组下标
}
for (let value of ['11','22','32'].values()) {
console.log('keys',value)//返回数组内的值
}
for (let [index,value] of ['11','22','32'].entries()) {
console.log('keys',index,value)//返回数组值和下标
}
}
{
console.log([1,2,3,4,5].copyWithin(0,3,4)) //第一个参数起始位置,第二个和第三个是要替换的数值起止位置
}
{
console.log([1,2,3,4].find((item) => {
return item > 3//只找到符合条件的第一个值
}))
console.log([1,2,3,4].findIndex((item) => {
return item > 3//只找到符合条件的第一个下标
}))
}
{
console.log([1,2,NaN].includes(1))//类似字符串中的indexOf
} /*----函数扩展-----*/
{
function test(x, y = "hello") {
console.log(x, y)
}
test('你好')//如果没有传入y值则默认为‘hello’
}
{
let x = 'test';
function test2(x, y=x) {
console.log(x,y)//作用域,在开始已经定义了x值,y=x,y值取函数中的参数值
}
test2('world')
}
{
function test3(...arg) {
for (let v of arg) {
console.log(v)//rest参数
}
}
test3(1,2,3,4,'a')
}
{
let a = [1,2,3]
let b = [4,5,6]
console.log([...a,...b])//数组合并
}
{
let arrow = v => v*2;
console.log(arrow(3))
}
{
function tail(x){
console.log(x)
}
function fx(x) {
return tail(x)//伪调用,提升性能
}
fx(123)
}
/*----对象扩展-----*/
{
let o = 1;//简单表示法
let k = 2;
let es5 = {
o: o,
k: k
}
let es6 = {
o,
k
}
console.log(es5,es6)
// 对象内函数
let es5_methods = {
hello: function(){
console.log("hello")
}
}
let es6_methods = {
hello(){
console.log('hello')
}
}
}
{
// 属性表达书
let a = 'b';
let es5_obj = {
a: 'c'
}
let es6_obj = {
[a]: 'c'//在es6中的key值是可以变的,可以是一个变量
}
console.log(es6_obj)
}
{
// 新增APi
console.log(Object.is('abc','abc'),'abc' === 'abc') console.log(Object.assign({a:'a'},{b:'b'}))//拷贝,第一个参数是要拷贝的对象上,第二个参数是要拷贝的值 }
ES6语法(一)的更多相关文章
- es6语法重构react代码
1.使用React.Component创建组件,需要通过在constructor中调用super()将props传递给React.Component.另外react 0.13之后props必须是不可变 ...
- vue 2.0 无法编译ES6语法
# vue2.0 webpack 无法编译 ES6 语法 之前在使用 vue 1.x 时用 vue-loader@8.0.0 版本可以正常打包vue的代码,包括ES6语法也能正常转为ES5语法,但是当 ...
- 把JavaScript代码改成ES6语法不完全指南
目录 * 核心例子 * 修改成静态变量(const)或块级变量(let) * 开始修改 * 疑问解释(重复定义会发生什么) * 疑问解释(let的块级作用域是怎样的) * 疑问解释(const定义的变 ...
- 让intellij idea 14 支持ES6语法
用eclipse做前端开发,用到了webpack,结果各种依赖导致软件卡的一比,简直不能动!虽然在同事的帮忙下,修改了一下配置,但仍然卡的没脾气.改用intellij idea 14解决了卡的问题,但 ...
- .vue文件在webstorm中es6语法报错解决方法
1 语法支持es6设置 Preferences > Languages & Frameworks > JavaScript 把 Javascript Language versio ...
- webpack打包不识别es6语法的坑
今天Vue项目npm run build 后webpack,报错uglifyjs,自己研究了一下,翻译过来,意思是不识别项目中写的高级语法,这里要把项目里es6语法转es5让浏览器识别, 也就是web ...
- ES6语法的学习与实践
ES6是JavaScript语言的新一代标准,是ECMAScript的第六个版本,加入了很多新的功能和语法,在很多框架,如在使用Vue,React等框架的项目中一般都采用ES6语法来编写的,下面对经常 ...
- 如何让浏览器支持ES6语法,步骤详细到小学生都能看懂!
为什么ES6会有兼容性问题? 由于广大用户使用的浏览器版本在发布的时候也许早于ES6的定稿和发布,而到了今天,我们在编程中如果使用了ES6的新特性,浏览器若没有更新版本,或者新版本中没有对ES6的特性 ...
- Webstorm添加新建.vue文件功能并支持高亮vue语法和es6语法
转载:https://blog.csdn.net/qq_33008701/article/details/56486893 Webstorm 添加新建.vue文件功能并支持高亮vue语法和es6语法 ...
- vue-i18n使用ES6语法以及空格换行问题
1.运行报错 报错使用了不恰当的exports Uncaught TypeError : Cannot assign to read only property 'exports ' of objec ...
随机推荐
- [工具开发] Grafana 报警仪表盘
Grafana 自V4以来加入了报警功能,所有的报警都集中在 Alert List 菜单里,数量多的话,查看起来很不方便.如下图: 为此我制作了一个简单的 Grafana Alert Dashboar ...
- WPF常见主界面的布局
一.概述 效果图: 暂时没做完,请等待 二.实现 (一)实现无边框窗口 原文:WPF 窗口去除顶部边框(正宗无边框) ============================ 最近在做一个大屏展示视频 ...
- Centos安装Git、DotNet、Docker
1.安装Git yum install git 可通过下面的命令查看Git版本 git --version 2.安装Dotnet sudo yum install libunwind libicu 导 ...
- A - Alice's Print Service ZOJ - 3726 (二分)
Alice is providing print service, while the pricing doesn't seem to be reasonable, so people using h ...
- Vue.js学习笔记(代码)
##v-cloak v-text v-html v-bind v-on的使用 <!DOCTYPE html> <html> <head> < ...
- 末学者笔记--Centos7系统部署cobbler批量安装系统
[前言]: cobbler是一个可以实现批量安装系统的Linux应用程序.它有别于pxe+kickstart,cobbler可以实现同个服务器批量安装不同操作系统版本. 系统环境准备及其下载cob ...
- [原创]免固件开发USB2.0 FPGA方案 速度40Mbyte/s+
USB 2.0接口,实测速度40Mbyte/s: 一个接口实现两种功能(USB2.0+FPGA配置): 免固件开发: 完整的FPGA代码,即拿即用: FPGA逻辑工程师开发USB接口福音: 平台可移植 ...
- 《ServerSuperIO Designer IDE使用教程》- 5.树形结构管理设备驱动,小版本更新。发布:v4.2.3.1版本
v4.2.3.1 更新内容:1.选择和管理设备驱动,增加树状结构显示.2.优化ide代码,核心代码没有改动.下载地址:官方下载 5. 树形结构管理设备驱动,小版本更新 5.1 概述 此次升级主要 ...
- python全栈开发day115、116-websocket、websocket原理、websocket加解密、简单问答机器人实现
1.websocket 1.websocket 与轮询 轮询: 不断向服务器发起询问,服务器还不断的回复 浪费带宽,浪费前后端资源 保证数据的实时性 长轮询: 1.客户端向服务器发起消息,服务端轮询, ...
- Python实现RSA无填充加密,兼容BouncyCastle
场景 某系统登录时密码经过前台rsa加密传给后端,为实现模拟登录需要原样生成加密串. 分析 前台通过RSA.js.BigInt.js.Barrett.js三个js文件实现加密,公钥通过ajax请求获得 ...