IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> ES6简单概述 -> 正文阅读

[JavaScript知识库]ES6简单概述

一、变量声明关键字

??????? 1.var?? 全局作用域和函数作用域,变量可提升,可重复使用

??????????? var 声明变量,变量可使用的范围称为:变量作用域
?? ??? ??? ?if(){} for(){} switch(){} 没有 作用域?? ??? ?
?? ??? ??? ?{}外面能访问到{}内部的变量
?? ??? ??? ?function 函数是有作用域的 {}外不能访问到函数内部的变量

??????????? 当js引擎解析js代表时候,当前作用域的变量提升到最前面赋值为undefined 然后执行代码

??????? 2.let??? 局部作用域,不会变量提升,并且不能重复声明

??????? 3.const? 值的类型不能修改,声明变量的时候必须赋值并且一般变量名大写

二、解构

??????? 1.数组

(1)定义:把数组或对象解析为单独变量???

?

????????

其中还有一个比较实用的小用法

var a=15; var b=13;? [a,b]=[b,a];可以在不用第三个变量的情况下使其交换值

2.对象

对象解构是没有顺序的

例子:

var {name,age,say="hello",...rest}={name:"卡莎",age:18,leg:2,say:"你好",eye:2,head:"是按"}
			alert(name)
			alert(age);
			alert(say)
			console.log(rest)
var {name,age,say="11",...rest}  =  obj

三、展开

...arr:可扩展

arr:展开为单独变量

四、字符串

常用的ES6的方法有for of:遍历,检测:includes(sub)是否包含 startsWith(sub)以sub开头等

for of 遍历,具体方法如下

var str="天地无极之刑天必杀术";
			for(let s of str){
				console.log(s);
			}
			// includes 包含  startsWith以xx开头   endWidth以xx结尾
			console.log(str.includes('天'))
			console.log(str.startsWith('无极之'))
			console.log(str.endsWith('必杀'))

下面是运行结果

?trim:去空白?? (1)trim()去掉两端空白? (2)trimLeft()去掉左边? (3)trimRight()右

例子:

var str="  我爱我的祖国  "
			console.log(str);
			console.log(str.trim());
			console.log(str.trimLeft())

?重复? repeate?

var str="adkj\n"
			console.log(str.repeat(3))

填充:padStart 可使时间19:3:7转换为19:03:07,前面的值填的多少数字就有多少位,不够的情况下向高位补0

var str="95"
			console.log(str.padStart(7,'0'))
			console.log(str.padStart(10,'-'))
			console.log("love".padStart(10,'-'))

四、箭头函数

01 箭头函数省略function
02 =>左边参数
03 箭头右边? 函数体? 返回值
04 参数0个或参数2个以上? 参数加上括号
05 如果函数体有多行 需要加上{}
?? ? 如果需要返回值return
06 如果返回一个对象则用()包裹对象({})

例如原始函数

var fn=function(msg){
	return "我喜欢"+msg
}
alert(fn("你"))

转换为箭头函数后就是

var fn=msg=>"我喜欢"+msg;
alert(fn("你"));

可大大缩小代码的敲打长度,但是代码可读性会较之前相比可读性会比较差,但是仍然是比较推荐使用的,毕竟在vue中也是经常使用

五、数组高阶方法

forEach? 遍历? 较之前的遍历相比他能在控制台输出的时候把每一个都还原,不会出现乱码现象

var arr=[1,2,3,5,7,9,5,66,21]
arr.forEach(item=>console.log(item))
			
			
var arr=[1,2,3,5,7,9,5,66,21]
arr.forEach((item,index)=>console.log(item,index))
			
			
var arr=[1,2,3,5,7,9,5,66,21]
arr.forEach((item,index)=>{
	if(item>10){console.log(item,index)}
})

item 当前遍历的元素?? index? 当前元素的下标??? self? 当前数组

map? 映射 从现有数组映射出新的数组

var arr=[1,3,5,9];
var arr2=arr.map(function(item,index,self){
	return{age:item}
})
console.log(arr2)

返回值为

?filter? 过滤 过滤掉判断为假的元素

var arr=[20,1,3,5,12,90]
var arr2=arr.filter(function(value){
	// 返回值为真,当前元素保留
	// 返回值为假,当前元素过滤
	return value>5;
})
console.log(arr2)

every?? 每一个?? :每一个返回结果为true 最终结果为true

var arr=[20,1,3,5,9]
var result=arr.every(function(item){
	return item>5;
})
console.log(result);

some? 有一个:有一个返回结果为true 最终结果便是true

var arr=[20,1,3,5,9]
var res=arr.some(function(item){
	return item>10
})
console.log(res)

find 查找元素:查找符合条件的第一个元素

findIndex 查找下标:查找符合条件的第一个元素的下标

sort? 排序:例:???? console.log(arr.sort((a,b)=>a-b))

六、函数

默认参数:function fn(a=10,b=20){}

调用:扩展参? fn(...arr)

定义:不定参??? function(...arges){}

七、对象(别再说找不到对象了!!!)

1.对象简写:变量和值简写,函数function简写

var name="mumu";
var age=18;
var say=function(){alert(`大家好我是${this.name}`)}
	// var obj={name:name,age:age,say:say}
	// var obj={name,age,sya,doit:function(){alert(this)}}
var obj={name,age,say,doit(){alert(this)}}
console.log(obj)

2.对象的动态属性(对象的属性可以通过js拼接)

var nick="hi";
var myObj={
	"name":"mumu",
	[nick+"msg"]:"你好"
}
console.log(myObj)

就先写到这里把,多了一次性也看不完,上面所有的例子都可以自己试一下,增加自己的动手能力才能更深彻的了解每一串代码的意义,加油!!

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-10-16 19:33:27  更:2021-10-16 19:34:54 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年5日历 -2024/5/20 17:41:44-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码