<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>简化的/增强的对象属性、方法和原型对象写法</title>
</head>
<body>
<script type="text/javascript">
console.log('对象属性的简化写法');
// 一、对象属性的简化写法
// ES5的字面量语法定义对象
// var obj = {
// "age":30,
// "nickname":"老三",
// "sex":"男"
// };
//ES6的字面量语法定义对象
//如果属性值单独有对应的变量,则可以简化
//例如:要将以下变量赋值给对象中的同名属性
var age = 30;
var nickname = "张三";
var sex = "男";
//预期效果如下
// var obj = {
// "age":age,
// "nickname":nickname,
// "sex":sex
// };
//那就这样做
var obj = {
age,
nickname,
sex
};
console.log(obj);
//结果如下
// var obj = {
// "age":30,
// "nickname":"张三",
// "sex":"男"
// };
// 二、对象方法的简化写法
console.log('对象方法的简化写法');
// ES5中对象的写法
// var obj = {
// "say":function(){
// return "hello";
// }
// };
// ES6中对象中的写法----function可以省略不写,方法名两边的引号一般不写
// var obj = {
// say(){
// return "hello";
// }
// };
// console.log(obj.say())
// 三、原型对象的简化写法
console.log('原型对象的简化写法');
//可以在字面量定义对象语法中,指定原型对象 __proto__
var person = {
coding(){
return '我在敲代码';
}
};
var age = 30;
var obj = {
"__proto__":person,
age,// "age":30,
"nickname":"张三",
"sex":"男",
say(){
return "hello";
}
};
console.log(obj.say());
console.log(obj.coding());
</script>
</body>
</html>
以上代码大家复制出来认真领会,总所周知的是:JS这门语言的知识点非常琐碎。
即使我们已经尽力将同类的知识点进行了归纳汇总,但依然琐碎。
|