<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
<!-- <script>
window.onload = function () {
var a = 10;
let b = 20;
const c = 30;
// ES5 预解析 变量提升 var function 结果 undefined
console.log(x);
var x = 11;
// ES6 中 直接报错
//---------------------------------------------------------------------
var aa = 11;
var aa = 22;
console.log(aa); // ES5不报错 aa=22；
let bb = 22;
//let bb=33; //ES6直接报错了，同一个作用域 不能出现相同的变量名称
//-----------------------------------------------------------------------
//ES6出现块级作用域
function ff() {
var cc = 111;
if (true) {
var cc = 999;
}
console.log(cc) //999
}
function fff() {
let cc = 111;
if (true) {
let cc = 999;
console.log(cc) //999
}
console.log(cc) //111
}
//-------------------------------------------------
function ddd1(i) {
var i = 1000;
console.log(i) // 1000 参数名 和变量名重了 var可以 let不行
}
ddd1(88);
function ddd(i) {
// let i = 1000;
console.log(i) // Identifier 'i' has already been declared 参数名 和变量名重了
}
ddd(99);
ff();
fff();
//-----------------------------------------------
for (var i = 0; i < 5; i++) { }
console.log(i) // 5 var 把i 提升为全局变量了 相当于var i=1 ; var i=2... var i=5;
for (let i = 0; i < 5; i++) { }
console.log(i) // Identifier 'i' not fund
var arr = [];
for (let i = 0; i < 5; i++) {
arr[i] = (() => {
console.log(i)
})
}
arr[3]() // var 都为5 改为let 则为对应的数字
arr[1]()
}
</script> -->
<!-- <script>
// const 声明一个只读的常量， 只能读取——基本类型 初始化的时候必须给值 （另一种是引用类型） 栈里
const abc = 111;
// abc = 222; // 报错
const abcarray = {
name: 'kkk',
}
abcarray.name = 'req' //这是可行的 引用类型 堆里
//-----------------------------箭头=> 不能当做 构造函数 不能new 没有原型对象 不能用arguments-----------------------------------
let f1 = function (v) {
return v;
}
f1(1234);
let f2 = v => v;
f2(2345);
// let ice1 = new f2('ice', 10); //: 报错 f2 is not a constructor 不能当做 构造函数
function f3(name, age) {
this.name = name;
this.age = age;
} //构造函数用来生成对象的模板
f3.prototype.sex = '1'; //没有原型对象
let ice = new f3('ice', 10);
let jb = new f3('jb', 20);
console.log(ice)
function f4() {
console.log(arguments) // 不能用arguments 参数集合
console.log(arguments[1])
}
f4(1, 2, 3, 4, 5, 6);
let f5 = (a, b, ...c) => {
console.log(c) //3,4,5
}; //箭头函数 用rest
f5(1, 2, 3, 4, 5);
//..............................................扩展运算符
function f6(...item) {
console.log(item) //0,1,2,3,4,5,6
}
let arr10 = [1, 2, 3];
let arr20 = [3, 4, 5];
f6(0, ...arr10, ...arr20, ...[6]);
//等价f6(0,1,2,3,4,5,6)
let arr12 = [...arr10, ...arr20];
let o1 = {
id: 1,
name: 'abc'
}
let o2 = {
...o1,
sex: 0
}
//等价
// let o2 = {
// id: 1,
// name: 'abc',
// sex: 0
// }
var str = 'global';
var obj = {
str: 'private',
getstr: function () {
console.log(this.str) //private
}
}
var obj1 = {
str: 'private',
getstr: () => {
console.log(this.str) //箭头函数本身是没有this的，他会去上下文寻找，obj1的上下文找到的是 global 严格模式报错
}
}
obj.getstr();
obj1.getstr();
</script> -->
<script>
window.onload = function () {
// ---------------------------------------数组解构-----------------
let [x, y, z] = [true, [1, 2, 3], { id: 1 }];
//等价
// x=true;
// y=[1,2,3];
// z={id:1};
let arr = [10, 20];
if (arr[0]) {
let x2 = arr[0]
} else {
let x2 = 1;
}
//简写
let x2 = arr[0] || 1;
//es6
let [x3 = 1, x4 = 1] = arr;
let [xx3 = 1, xxx4 = 1] = [undefined, null]; //xxx3=1,xxx4=null undefined默认值生效
//对象解构
let obj1 = {
id: 999,
name: 'kk',
data: {
name: 'bb',
title: 'tt'
},
res: {
data: {
act: '888act',
func: '999func'
}
}
}
// let id = obj1.id;
// let act = obj1.res.data.act;
//等价于 ES6
let { id: _id = 1, act: _act = 'actdefault' } = obj1; //:改的别名 = 给的默认值 es6更方便
console.log(obj1);
console.log(_id);
//--------------------------------------------------------------------------------------------------------
let arrk = [1, 2, 3, 4, 5, 6, 7, 1, 2, 5, 6, 7, 9, 10];
const arrs = new Set();
arrs.add(1).add(2).add(3).add(2); console.log(arrs); // {1,2,3}
arrs.add(1).add(2).add(3).add('2'); console.log(arrs); // {1,2,3,'2'} 进行的是类型匹配
const arr3 = new Set();
arr3.add(arrk);
console.log(arr3); //这样没去重，相当于把arrk 作为一个对象添加进去了
var arrs4 = new Set(arrk); console.log(arrs4); //去重后的arrk 但不是数组了
arrk.forEach((i) => {
arrs.add(i);
})
console.log(arrs);
let obj3 = new Object();
obj3.id = 1;
obj3['msg'] = 'no data'; //这添加的是属性
// obj3[msg] = 'nodata'; //msg 这只是一个变量
Array.from(arrs4); //{}对象转数组
[...arrs4]; //{}对象转数组
// Array.from(arrs4((i) => {
// i > 5
// }));
console.log("//////////////////")
console.log(Array.from(new Set(arrk.filter(i => i > 5)))) //去重排序
const arr6 = [{ value: 30 }, { value: 10 }, { value: 3 }, { value: 60 }, { value: 30 }, { value: 30 }, { value: 30 }, { value: 30 },] //去掉含3的
let kk = arr6.filter(i => (i.value / 3 == 0));
console.log([...(new Set(arr6.filter(i => ((i.value / 3) != 0))))])
}
</script>
</html>
浙公网安备 33010602011771号