19_对像.html 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  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. // 属性可以理解为这个对象的特征或者标签
  12. // 属性定义方法。 属性名:属性值
  13. // 属性一般对应都是非函数
  14. var person = {
  15. userName:"张三",
  16. age:18,
  17. sex:"男",
  18. hobby:["运动","游戏","学习"],
  19. // 方法可以理解为这个对象的行为
  20. // 方法定义方法。 方法名:方法体
  21. // 方法值是一个函数
  22. sayHello:function(){
  23. // 方法内如果使用自己的属性可以通过this来调用
  24. console.log("你好我叫"+this.userName);
  25. }
  26. }
  27. // 获取对象属性 使用“.”
  28. var friendName = person.userName;
  29. // 调用方法
  30. person.sayHello();
  31. // 修改属性
  32. person.age = 19;
  33. // 删除属性
  34. delete person.hobby;
  35. // 添加属性
  36. person.address = "北京";
  37. console.log(person)
  38. // var foo = function(){
  39. // console.log("我是foo函数");
  40. // }
  41. // foo()
  42. // var video = {
  43. // videoName:"XXX视频",
  44. // videoTime:"120秒",
  45. // videoSize:"100M",
  46. // like:["张三","李四","王五"],
  47. // comment:[
  48. // {
  49. // userName:"张三",
  50. // comment:"评论内容"
  51. // },
  52. // {
  53. // userName:"李四",
  54. // comment:"评论内容"
  55. // }
  56. // ]
  57. // }
  58. </script>
  59. </body>
  60. </html>