Blogger Information
Blog 145
fans 7
comment 7
visits 164549
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
JS基础知识:变量和JSON对象
李东亚¹⁸⁰³⁹⁵⁴⁰¹²⁰
Original
931 people have browsed it

课堂知识总结:

一、变量和对象

1、JS变量类型:
(1)原始类型:number、string、boolean;
(2)特殊类型:null、undefined;
a、null和undefined都表示空和无;
b、null一般用来表示空对象;
c、undefined专用来表示非对象类型的空和无;
d、null和undefined参与计算时:null自动转换为0,undefined自动转换为NAN(属于number类型,但NAN:not a number);
(3)对象类型:array、object、function;
2、查询字面量类型:typeof 变量名;返回变量类型;
3、数组:array
(1)数组长度:数组名.length;
(2)判断是否数组数组:Array.isArray();返回boolean值;
(3)遍历数组:for(var i=0;i<array.lenght;i++){……}跟PHP一样;forEach(function(item,index,array){……}){……}
4、数组函数:array.slice(start,end);start和end是数组索引,包含start但不包含end;
5、数组函数:array.splice(start,deleteCount,item……);
5.1、slice和splice的区别是,slice不改变原数组,返回一个新数组;
splice()改变原数组,返回删除或者替换的的数组内容;
6、对象(类似php关联数组):
(1)访问对象和属性使用.操作符;也可以使用关联数组访问方式访问;
(2)for(key in obj)循环对象;
(3)obj.forEach(function(){},array){……}
7、Object.keys(obj):获取对象属性和方法的名
8、函数:function 函数名(){};函数调用函数名();
9、匿名函数和使用:(function(){})();

二、流程控制语句

1、单分支:if(){……}
2、双分支和多分支:if(){……}else{……}if(){……}else if(){……}else{……}
3、多分支判断语句:switch(a){case a:…… break; default: ……}
4、循环语句:for(){};while(){……};以及do{}while();

三、js对象转换JSON;

1、JS对象转换成JSON后,没有方法和值为undefined以及原始对象成员方法;
2、对象序列化函数:JSON.stringify(obj,array|function(key,value){});
当第二个参数为数组:可以限制序列化的属性;
当第二个参数为匿名函数时:可以处理对象中的成员并返回;

代码练习

  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>JS变量</title>
  7. </head>
  8. <body></body>
  9. <script>
  10. //变量和变量类型
  11. var num = 20;
  12. var str = "PHP";
  13. var bool = false;
  14. console.log(num, str);
  15. console.log(bool);
  16. console.log(typeof num, typeof str, typeof bool);
  17. //null和undefined
  18. var age; //声明为赋值的变量:undefined;
  19. console.log(age);
  20. console.log(typeof age);
  21. console.log(age + 10); //undefined参与运算时,自动转换为NAN
  22. console.log("………………………………");
  23. age = null; //null的类型为属于对象
  24. console.log(age);
  25. console.log(typeof age);
  26. console.log(age + 10); //null参与运算时,自动转换为0;
  27. console.log("数组");
  28. var users = ["ldy", "dlf", "cqw", "xjw"];
  29. console.log(users[1]);
  30. console.log(typeof users);
  31. if (Array.isArray(users)) console.log("是数组");
  32. for (var i = 0; i < users.length; i++) {
  33. console.log(users[i]);
  34. }
  35. users.forEach(function (item, index, array) {
  36. console.log(item);
  37. });
  38. console.log(users.slice(0, 2));
  39. console.log(users);
  40. console.log("…………………………");
  41. users.splice(1, 0, "ljp", "zkn"); //增加
  42. console.log(users);
  43. console.log(users.splice(1, 2, "ljp1", "zkn1")); //替换
  44. console.log(users);
  45. users.splice(1, 2); //删除
  46. console.log(users);
  47. //对象
  48. var obj = {
  49. id: 1,
  50. name: "ldy",
  51. age: 30,
  52. couser: ["php", "js"],
  53. };
  54. console.log(obj.id);
  55. console.log(obj["age"]);
  56. console.log(obj["couser"][0]);
  57. for (key in obj) {
  58. console.log(obj[key]);
  59. }
  60. var keys = Object.keys(obj);
  61. keys.forEach(function (item, index, array) {
  62. console.log(this[item]);
  63. }, obj);
  64. // 函数
  65. function sum(a, b) {
  66. console.log(a, "+", b, "=", a + b);
  67. }
  68. sum(5, 10);
  69. //匿名函数
  70. (function (a, b) {
  71. console.log(a, "+", b, "=", a + b);
  72. })(20, 30);
  73. //把js对象转化成JSON对象
  74. console.log(JSON.stringify(obj));
  75. console.log(JSON.stringify(obj, ["id", "name"]));
  76. console.log(
  77. JSON.stringify(obj, function (key, value) {
  78. if (key != "age") {
  79. return value;
  80. } else {
  81. return "保密";
  82. }
  83. // return value;
  84. })
  85. );
  86. </script>
  87. </html>

运行结果:

Correcting teacher:天蓬老师天蓬老师

Correction status:qualified

Teacher's comments:非常认真, 继续
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
1 comments
李**¹⁸⁰³⁹⁵⁴⁰¹²⁰ 2020-05-23 20:22:42
在JS中forEach()是一个方法:array.forEach(function(currentValue, index, arr), thisValue)!
1 floor
Author's latest blog post