14_对象扩展.html 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <script>
  10. // 对象扩展
  11. // let sex = "男";
  12. // let keyStr = "school";
  13. // let keyStr2 = "school2";
  14. // let obj = {
  15. // name:"张三",
  16. // age:18,
  17. // // 如果属性值为变量,且属性名与变量名相同,可以省略属性名
  18. // sex,
  19. // // es6中 对象的方法可以省略function关键字
  20. // talk(){
  21. // console.log("hello");
  22. // },
  23. // // 如果属性名称为变量可以使用[]进行表示
  24. // [keyStr]:"清华大学",
  25. // [keyStr2]:"北京大学",
  26. // }
  27. // obj.sex = sex;
  28. // obj.talk();
  29. // console.log(obj);
  30. // 访问属性时如果属性名为变量,需要使用[]进行表示
  31. // console.log(obj[keyStr]);
  32. // 访问属性时也可以写一些简单的逻辑表达式
  33. // console.log(obj["school"+2]);
  34. // let obj1 = {
  35. // a:1
  36. // }
  37. // let obj2 = {
  38. // a:1
  39. // }
  40. // let obj3 = obj1;
  41. // let a = 1;
  42. // let b = 1;
  43. // 当判断两个变量是否相等时,其实判断的时值(栈内存中存储的值是否相等)
  44. // console.log(a==b);
  45. // console.log(obj1 == obj3);
  46. // Object.is 当判断两个对象是否相等时,其实判断的时对象的地址是否相等
  47. // console.log(Object.is(obj1,obj3));
  48. let obj1 = {
  49. userName:"张三",
  50. }
  51. let obj2 = {
  52. age :28
  53. }
  54. // 合并对象 Object.assign()
  55. // 合并对象时,会将第二个对象及后边的所有对象的属性值合并到第一个对象的属性中
  56. // let obj3 = Object.assign(obj1,obj2);
  57. // console.log(obj1);
  58. let obj3 = Object.assign({},obj1,obj2);
  59. console.log(obj3,obj1);
  60. // in 关键字可以判断一个对象是否包含某个属性
  61. // console.log("userName" in obj1);
  62. // for...in 循环可以遍历一个对象的所有属性
  63. // for(let key in obj3){
  64. // console.log(key);
  65. // console.log(obj3[key]);
  66. // }
  67. // Object.keys() 方法可以获取一个对象的所有属性名,以数组的形式返回
  68. let keys = Object.keys(obj3);
  69. console.log(keys);
  70. </script>
  71. </body>
  72. </html>