let , const关键字#
var#
看习惯了java, 看js真的是忍不住想笑,比如说这个var,它太自由了,自由到{}根本限制不住它的生命周期
js的var关键字,无论在何处声明,都会被视为声明在函数的最顶部,不在函数里面的就被视为在全局的最顶部,这就是所谓的变量提升
function aa(bool) { if (bool) { var test = "hello"; } else { console.log(test); } } aa(false);
比如上面的代码, 他就不会报错,而是说undifined, 因为var的变量提升, 相当于下面那样:
function aa(bool) { var test; if (bool) { test = "hello"; } else { console.log(test); } } aa(false);
let#
换成let关键字,就是普通变量, 它的生命周期被限制在 { }
function aa(bool) { if (bool) { let test = "hello"; } else { console.log(test); } }
const#
const 声明常量, 值不允许被修改,而且必须初始化
function aa() { let a = 'abc'; const test = a; a = "world"; alert('a=='+a); alert('test=='+test); } aa();
结果就是 abc world
如果尝试直接对test赋值, 编译器会报错的
模板字符串的拼接#
这样取值完全没问题, 但是js的设计者认为他 + 太多了,low爆了
console.log(name1 + "喜欢" + name2);
于是: ${} , 注意啊, 是esc下面的键位
console.log(`${name1}喜欢${name2}`);
方法入参的默认值#
如果我们不给入参传值, 默认就是空, 一用就报错, 所以参数需要默认值是很有必要的
这时候, 用户传递进来值了,使用的就是用户传递进来的值, 在java中想干这个事,得在参数位置加老长的注解
function sayName(name = "张三") { alert(name); }
箭头函数#
es6的箭头函数和java8的lambda表达式如出一辙, 因为学了java8, 所以es6的箭头函数也是秒上手了, 包括流式的操作也如出一辙
对象的简写和解构#
原来,如果方法想返回一个对象,需要这样写
function people(name, age) { return { name: name, age: age } }
在es6中,如果属性和值相同 ,就变成了这样
function people(name, age) { return { name, age } }
动态的添加属性, 在java想都别想,#
let p = {name: '张三', age: 680}; alert(p.name); alert(p.age);
- 添加属性
p.address = '山东';
- 添加函数
p.add = () => {};
其实js这么自由也不一定是好事, 起码不能乱点了, 它也不给报错, 一不留神就多了个属性
组装对象或数组SpreadOperator ...#
const color = ['red', 'blue']; const colorful = [...color, 'green'] // 现在 colorful数组就是 三个颜色的数组 , 同样换成{} 也一样
Import 和 export#
这个特性vue用的最多, 模块化的感觉很强烈
let fun = function () { console.log("fun") } export {fun} // 在第二个文件 导入 import fun from "./fun"; // 然后使用 fun()
面向对象的编程模式-类#
class person { // 构造函数 constructor(name) { this.name = name; // 不提前定义变量? 不存在的,直接点就行了老铁 } // 方法 sayHello() { console.log("hello"); } } // 类的继承 class Student extends person { constructor(name) { super(name); } sayHaha() { console.log("haha"); } }
使用:
它并不能写 父类引用指向子类对象
//person stu = new Student('zhangsan'); var stu = new Student('zhangsan'); stu.sayHaha();
