ES6简介
function fn(){
return 100;
}
let name='sui';
let age=19;
let sui={
name,
age,
["pro"+fn()]:"sdfe",
play(){
console.log("我会打大鱼")
}
};
console.log(sui.name)
sui.play();
console.log(sui["pro100"])
对象字面量的输出方式以及定义好处
1.对象字面量的输出方式有两种:传统的‘。’,以及数组方式,只不过用数组方式输出时,方括号里面要用引号括起来,如
var box = {
name:’abc’;
age:28
};
alert(box[‘name’]);
给对象定义方法,
A:如果用传统定义对象的方式,就需要先定义方法,然后再把这个方法名赋值给对象的一个属性,如果要调用这个方法不加括号,就是返回方法代码;如果要调用这个方法该对象属性后面加上括号,就得到方法的返回值
function objrun(){
return ‘123’;
}
var box = new Object();
box.name=’abc’;
box.age = 28;
box.run = objrun;
alert(box.run()); //结果为123
// alert(box.run); //结果为function objrun(){
return ‘123’;
}
//如果box.run = objrun();
//alert(box.run); //结果为123,如果带上圆括号,就报错啦
B:用字面量定义,只需要直接在对象的这个属性上,写function就行,这个function上面没有函数名,他是个匿名函数,那怎么调用这个方法呢,用对象的这个属性名,要调用方法,同上就行
如:
var box = {
name:’abc’,
age:28,
run:function(){
return ‘123’;
}
}
alert(box.run());
2.对象字面量的定义方式,可以轻松搞定函数大量参数需要一一对应输出的情况。他的对策就是给函数传入一个对象,而这个对象是用字面量的方式定义的,属性和值对应的方式可以一目了然他们的关系,因为函数只是一段代码,必须调用才能执行
如:
function AA(obj){
alert(obj.name);
alert(obj.age);
}
var obj = {
name: 'abc',
age: 28
}
AA(obj);
2.对象字面量的demo
/**
* @author zhanghua
*/
var literal = {
add: function(){
alert("add");
},
del: function(){
alert("delete");
},
update: function(){
alert("update");
},
name: "zhangsan",
callLiteral: function(){
// 对于当前字面量对象的调用,要加this关键字
this.add();
}
};
2.“箭头”(=>)定义函数。
let name='hello';
()=>{
console.log('name');
};
(name)=>{
console.log(name);
} ;
let d= name=>{
console.log(name);
};
(name,age)=>{
console.log(name,age);
};
let c=(a,b)=>a+b;
(a,b)=>{
console.log(a+b);
}
console.log(c(1,2));
ar f = v => v;
上面的箭头函数等同于:
var f = function(v) {
return v;
};
如果箭头函数不需要参数或需要多个参数,就使用一个圆括号代表参数部分。
由于大括号被解释为代码块,所以如果箭头函数直接返回一个对象,必须在对象外面加上括号。
箭头函数可以与变量解构结合使用。
dom2
function foo() {
fom( => {
console.log('args:', fom);
}, 100);
}
foo(2, 4, 6, 8)
// args: [2, 4, 6, 8]
上面代码中,箭头函数内部的变量fom,函数foo的arfom变量;
参数默认值
function sayHello(name){
//传统的指定默认参数的方式
var name=name||'dude';
console.log('Hello '+name);
}
//运用ES6的默认参数
function sayHello2(name='dude'){
console.log(`Hello ${name}`);
}
sayHello();//输出:Hello dude
sayHello('Wayou');//输出:Hello Wayou
sayHello2();//输出:Hello dude
sayHello2('Wayou');//输出:Hello Wayou
不定参数
//将所有参数相加的函数
function add(...x){
return x.reduce((m,n)=>m+n);
}
//传递任意个数的参数
console.log(add(1,2,3));//输出:6
console.log(add(1,2,3,4,5));//输出:15
拓展参数
var people=['Wayou','John','Sherlock'];
//sayHello函数本来接收三个单独的参数人妖,人二和人三
function sayHello(people1,people2,people3){
console.log(`Hello ${people1},${people2},${people3}`);
}
//但是我们将一个数组以拓展参数的形式传递,它能很好地映射到每个单独的参数
sayHello(...people);//输出:Hello Wayou,John,Sherlock
//而在以前,如果需要传递数组当参数,我们需要使用函数的apply方法
sayHello.apply(null,people);//输出:Hello Wayou,John,Sherlock
Symbol
let a=1;
let b=1;
console.log(a==b); //结果:true
let x=Symbol('this is x');
console.log(typeof x); //结果:symbol
let y=Symbol('y');
console.log(x==y); //结果: false
//这里 Synbol 前面不能使用 new 操作符。
//防止对象的属性被篡改
let sz={name:'曹伟',age:19,[Symbol('xh')]:'007'};
sz['name']='caowei123';
sz[Symbol('xh')]='009';
console.log(sz); //结果:Objectage: 19name: "caowei123"Symbol(xh): "007"Symbol(xh): "009"__proto__: Object
console.log(sz.name); //结果:caowei123
关于数据类型可以参阅javascript引用类型和基本类型详解一章节,
let sVal = Symbol();
console.log(typeof sVal)
上面的代码的输出值是'symbol';
使用Symbol()函数可以创建一个symbol类型值。
前面不能使用new,否则会报错;因为Symbol是一种值类型数据,这也是很好理解的.Symbol()用作Symbol值的描述,也可以理解为键(key),代码实例如下:
let s1 = Symbol('20');
let s2 = Symbol("2015");
通过键就可以比较方便的区分两个Symbol值。
键相同的两个Symbol值并不相同:
let s1 = Symbol("男");
let s2 = Symbol("汉");
console.log(s1 == s2);
上面两个Symbol值是不相等的。
Symbol值不能够被隐式转换为字符串类型,代码实例如下:
let s = Symbol("未婚");
//报错
`antzone ${sym}`
//报错
"antzone" + sym