es6的基本用法
1. let和const
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
let:
//局部作用域
var a = [];
for (let i = 0; i < 10; i++){
a[i] = function () {
console.log(i)
}
}
a[2]() //2
a[5]() //5
//不会存在变量提升
console.log(a); //undefined
{
var a = 1;
var a = 10
}
console.log(a); //10
//变量不能重复声明
let a = 1;
let a = 10;
console.log(a); //10 // const:局部作用域,不会存在变量提升,不能重复声明,只声明常量,不可变的量
</script>
</body>
</html>
2. es6的箭头函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
function add(x) {
return x
}; console.log(add(1)); //1 let add1 = function (x) {
return x
};
console.log(add1(10)); //10 let add2 = (x) => x;
console.log(add2(20)); //20
</script>
</body>
</html>
3. es6的对象
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
let person1 = {
methods:{
fav:function () {
}
},
name:"ritian",
age:30,
fav:function () {
console.log(this); //this指当前的person1对象
console.log(this.name);
console.log(this.age);
}
};
person1.fav(); let person2 = {
name:"ritian2",
age:30,
fav:() => {
console.log(this); //this指定义person的父级对象(window)
console.log(this.name);
}
};
person2.fav(); let person3 = {
name:"ritian",
fav(){
console.log(this); //当前this,即person3
}
};
person3.fav()
</script>
</body>
</html>
4. es6的类
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>4</title>
</head>
<body>
<script>
function Vue(name,age) {
this.name = name;
this.age = age;
console.log(this.name); //ritian
console.log(this.age); //18
} //基于原型给对象声明方法
Vue.prototype.showName = function(){
console.log(this.name);
};
Vue("ritian",18); class Person{
constructor(name="ritian",age=18){
this.name = name;
this.age = age;
}
showname(){
console.log(this.name);
}
showage(){
console.log(this.age);
}
} let V = new Person();
V.showname(); //ritian
V.showage(); //18
</script>
</body>
</html>
es6的基本用法的更多相关文章
- ES6语法 promise用法
ES6语法 promise用法 function doSomething(){ return new Promise((resolve,reject)=>{ resolve('jjjj');// ...
- es6的promise用法详解
es6的promise用法详解 promise 原理 promise是es6的异步编程解决方案, 是es6封装好的对象: 一个promise有三种状态:Pending(进行中).Resolved(已完 ...
- ES6之Promise用法详解
一 前言 本文主要对ES6的Promise进行一些入门级的介绍.要想学习一个知识点,肯定是从三个方面出发,what.why.how.下面就跟着我一步步学习吧~ 二 什么是Promise 首先是what ...
- ES6 Class基本用法
JavaScript 语言中,生成实例对象的传统方法是通过构造函数.下面是一个例子. function Point(x, y) { this.x = x; this.y = y; } Point.pr ...
- es6 reduce的用法
一.forEach回调函数参数,item(数组元素).index(序列).arr(数组本身)循环数组,无返回值,不改变原数组不支持return操作输出,return只用于控制循环是否跳出当前循环 二. ...
- 非vue等框架中html 中使用es6的模块用法小结
以下是html中使用es6模块化引入的方法 一.html中的引入 <!DOCTYPE html> <html lang="en"> <head> ...
- 数组的高级应用含ES6 for of 用法
// 在ES5中常用的10种数组遍历方法: // 1. 原始的for循环语句 // 2. Array.prototype.forEach数组对象内置方法 // 3. Array.prototype.m ...
- es6 map的用法
let arr =[ {title:'aaaa',read:100,hot:true}, {title:'bbbb',read:50,hot:false}, {title:'ccc',read:100 ...
- ES6中Class的用法及在微信小程序中的应用实例
1.ES6的基本用法 ES6 提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类.基本上,ES6 的class可以看作只是一个语法糖,它的绝 ...
随机推荐
- 基于QT的在线打字练习软件助手（C/S模型）good
简介 通过基于QT中QTcpServer和QTcpSocket以及UI编程,实现了基于TCP协议的C/S模型在线打字练习软件助手,服务端处理各客户端打字数据,以及显示在线打字客户列表即实时更新打字 ...
- qt+opencv对两幅图片进行融合
本文博客链接:http://blog.csdn.net/jdh99,作者:jdh,转载请注明. 源代码: #include "widget.h" #include "ui ...
- 海康威视频监控设备Web查看系统（二）：服务器篇
声明:本系列文章只提供交流与学习使用.文章中所有涉及到海康威视设备的SDK均可在海康威视官方网站下载得到.文章中所有除官方SDK意外的代码均可随意使用,任何涉及到海康威视公司利益的非正常使用由使用者自 ...
- python算法与数据结构-单链表(38)
一.链表 链表是一种物理存储单元上非连续.非顺序的存储结构,数据元素的逻辑顺序是通过链表中的指针链接次序实现的.链表由一系列结点(链表中每一个元素称为结点)组成,结点可以在运行时动态生成.每个结点包括 ...
- ES 21 - Elasticsearch的高级检索语法 (包括term、prefix、wildcard、fuzzy、boost等)
目录 1 term query - 索引词检索 1.1 term query - 不分词检索 1.2 terms query - in检索 2 prefix query - 前缀检索 3 wildca ...
- 使用wireshark抓包分析-抓包实用技巧
目录 使用wireshark抓包分析-抓包实用技巧 前言 自定义捕获条件 输入配置 输出配置 命令行抓包 抓取多个接口 抓包分析 批量分析 合并包 结论 参考文献 使用wireshark抓包分析-抓包 ...
- Anaconada安装
目录 Anaconda介绍 Anaconda下载 安装Anaconda 配置环境变量 管理虚拟环境 activate 切换环境 卸载环境 关于环境总结 安装第三方包 卸载第三方包 查看环境包信息 导入 ...
- 《Spring Cloud》学习（三） 容错保护！
在微服务架构中,我们将系统拆分成了很多服务单元,各单元的应用间互相依赖.由于每个单元都在不同的进程中运行,依赖通过远程调用的方式执行,这样就有可能因为网络原因或是依赖服务自身间题出现调用故障或延迟,而 ...
- Java学习笔记——设计模式之七.模板方法模式
模板方法模式(TemplateMethod),定义一个操作中的算法的骨架,而将一些步骤延迟到子类中.模板方法使得子类可以不改变一个算法的结构即可重定义该算法的某些特定步骤. 结构图: 代码: 算法骨架 ...
- Map集合的4种遍历方式
import java.util.HashMap;import java.util.Iterator;import java.util.Map; public class TestMap { p ...