ES6 var let const 的使用
- var let const 声明变量 全局作用域 和 块级作用域的区别
- let count 不能重复定义，count不能重新赋值，count的对象可以改变
const Jelly = Obj.freeze(person) // 用es5函数 .freeze 可使其值不可变
for ( let i = 0 ; i < 10 ; i++ ) {
setTimeout(function()) {
console.log( ` i : $(i) `);
}, 1000 )
}
箭头函数 >=
const d = num.map{ function(num){ return num*3;} } //默认函数
const d = num.map{ num >= { return num*3; } } //改箭头函数，一个参数可以去掉括号
const d = num.map{ (num,index) >= { return num*3; } } //多个参考需要加括号
- 箭头函数可以隐示返回，不加return
- 箭头函数可以直接继承父级的this值
- 箭头函数不适合 1.使用需要保留父级值时候 2.需要使用this的时候 3.需要使用arguments时候
函数参数默认值
function mu(a=2 , b=3 ) { return a*b} //6
mu(5) //15
mu( , 5) //报错
mu( undefined, 5) // 10
mu( null, 5) //报错
模版字符串 ``
1.示例
const template = ` `
2.示例 模版字符串中可以使用变量、函数和三元表达式
const template = `
${ Jelly.todos.map( todo >=`
- ${todo.name} @{todo.completed ? 'x' : 'o'}
`).join('')}
3.示例 模版字符串 ` ...others ` 标识简写剩余其它参数
-[ES中reduce()的用法
栗子.将数组元素变成字符串拼接
var rs1 = arr1.reduce((prev , ...cur) =>{
return prev+'::' +cur
})
console.info('rs1',rs1);
4.实例过滤用户输入 .sanitize 函数
.sanitize(){}
`
字符串函数 .startsWith() .endsWith() .includes() .repeat()
const id ='350402199008302011'
const fan = 'I love football'
//头部开始校验包含字符串
id.startsWith('35') //ture
id.startsWith('1990',6) //ture
fan.startsWith('I') //ture
fan.startsWith('i') //false大小写敏感
//尾部开始校验包含字符串
id.endsWith('x') // false
//校验包含字符串
fan.includes('football') // ture
fan.includes('football',10) //false
//重复字符串
'ha'.repeat(10) // hahahahahahahahahaha
.
对象解构
const Tom={
name= 'Tom joy',
age= 22,
family:{
mother: 'Noah joy';
father: 'waah joy';
brother: 'boah joy';
sister: undefined;
}
}
const { name, age } = Tom ;
console.log(name,age) // Tom joy 22
const { father:a, mother:b, brother:c , sister = 'have no sister' } = Tom.faily
console.log(a,b,c);
console.log(sister); // have no sister
数组解构
const numbers= ['one', 'two', 'three', 'four' ];
const [one, ...others] = number
console.log{one,others};
let a=10;
let b=20;
[a,b]=[b,a];
console.log(a,b); // 20 ,10
For of 循环遍历简介or示例
fruits = [ 'Apple', 'Banana', 'Orange', 'Mango' ]
for (let i=0;i< fruits; i++ ){
const log(fruits[i]);
}
fruits.forEach( friut >={ console.log(friut) )} //无法终止
for (let index in fruits) { console.log(fruits[index])} //
for (let index of fruits) { console.log(fruits)} //可以加判断break或者继续continue
-----array.entries() //js 函数返回迭代对象
for ( let [index, fruit ] of fruits.entres ){
console.log(`${fruit} ranks ${index+1} in my favorite fruits`)
}
------todos
const lis = document.querySlelectorAll('li')
for (let li of lis) {
li.addEventListener('click', function){
this.classList.toggle('competed')
}
}
数组Array .from() and .of() 示例
const todos = document.querySelectorAll('li')
const todosArr = Array.from(todos);
const names = todosArr.map( todo => todo.textContent);
console.log(names);
const todos = document.querySelectorAll('li')
const names = Array.from ( todos, todo => todo.textContent);
console.log(names);
function sum() {
return Array.from(arguments).reduce((a, b) => a + b, 0)
}
sum(1,3,5); //9
const website = 'taobao';
console.log(Array.from(website));
// (6) ["t", "a", "o", "b", "a", "o"] 可以拆分字符串为数组对象
数组 更多的Array 方法使用 .find .findIndex .some .every
const invs =[
{name: 'apple' , cons:2},
{name: 'banana' , cons:3},
{name: 'orange' , cons:0},
{name: 'cherrie' , cons:7}
];
//. find()
// const bananas = invs.find( fruit => {
// if(fruit.name== 'orange'){
// return true
// }
// return false
// });
const bananas = invs.find( list => list.name === 'orange');
console.log(bananas) // {name: "orange", cons: 1}
// .findIndex()
const banIn= invs.findIndex(list => list.name ==='apple');
console.log(banIn);
// .some
const bansome = invs.some( list => list.cons>1);
console.log(bansome);
//.every()
const banery= invs.every( list => list.cons>1);
console.log(banery)
剩余参数的使用 ...numbers
function sum(...num) {
return num.reduce((a,b) => a * b,1)
}
console.log(sum(1,2,3,4)) //24
console.log(sum(1,2,3,4,5)) //120
function conver(rate,...nums) {
return nums.map( list => list * rate);
}
const ams = conver(0.88,13,14,32,554);
console.log(ams); //[11.44, 12.32, 28.16, 487.52]
const player = ['jok',234,56,65,44,66,78,99];
const [name,id,...scores] = player;
console.log(name,id,scores); //[56, 65, 44, 66, 78, 99]
const young=['gegg','jonn','lobo'];
const olds=['bibi','kiki','cici'];
const members= [...young,'and',...olds];
console.log(members) //["gegg", "jonn", "lobo", "and", "bibi", "kiki", "cici"]
const mens= [...members];
mens[0]='mens';
console.log(mens); /// ["mens", "jonn", "lobo", "and", "bibi", "kiki", "cici"]
剩余参数的使用实例
Good Man!
