基础

交换变量方式

  1. //利用第三方变量进行交换
  2. var num1 = 10;
  3. var num2 = 20;
  4. var temp;
  5. temp = num1;
  6. num1 = num2;
  7. num2 = temp;
  8. console.log(num1);
  9. console.log(num2);
  1. //一般适用于数字交换
  2. var num1 = 10;
  3. var num2 = 20;
  4. num1 = num1 + num2;
  5. num2 = num1 - num2;
  6. num1 = num1 - num2;
  7. console.log(num1, num2);

类型转换

  1. //类型转换
  2. parseInt()---------->转整数
  3. parseFloat()-------->转浮点数
  4. Number()------------>转数字
  5. .toString()---------->转字符串(严格)
  6. String()------------->转字符串(不严格)
  7. Boolean()------------>布尔值(truefalse)

变量

  1. var number=10;
  2. var num1=20;
  3. var name ="小黑";
  4. var flag = true;
  5. var nll = null;
  6. var obg = Object();

字符串

  1. //字符串可以用单引号,双引号括起来
  2. var str1='jfdsghiuijhvjfkvui';
  3. var str2="jfdsghiuijhvjfkdsgfyugfvui";
  4. //获取字符串长度用变量名.length
  5. console.log(str1.length);
  6. console.log(str2.length);
  7. // 字符串拼接用+
  8. var pinJie1= "我是";
  9. var pinJie2= "小明";
  10. console.log(pinJie1+pinJie2);

操作符

  1. 操作符:一些符号-----用来计算
  2. 算数运算符: + - * / %
  3. 算数运算表达式:由算数运算符连接起来的表达式
  4. 一元运算符: 这个操作符只需要一个操作数就可以运算的符号 ++ --
  5. 二元运算符: 这个操作符需要两个操作数就可以运算,
  6. 三元运算符: -----不讲,明天讲
  7. 复合运算符: += -= *= /= %=
  8. 复合运算表达式:由复合运算符连接起来的表达式
  9. *
  10. * var num=10;
  11. * num+=10;------>就是:num=num+10;
  12. * console.log(num);20
  13. *
  14. 关系运算符: > < >= <= ==不严格的 ===严格的 !=不严格的不等 !==严格的不等
  15. * 关系运算表达式:由关系运算符连接起来的表达式
  16. * 关系运算表达式的结果是布尔类型
  17. * 逻辑运算符:
  18. * &&---逻辑与--并且
  19. * ||---逻辑或---或者
  20. * !---逻辑非---取反--取非
  21. * 逻辑运算表达式:由逻辑运算符连接起来的表达式
  22. * 表达式1&&表达式2
  23. * 如果有一个为false,整个的结果就是false
  24. * 表达式1||表达式2
  25. * 如果有一个为true,整个的结果为true
  26. * !表达式1
  27. * 表达式1的结果是true,整个结果为false
  28. * 表达式1的结果是false,整个结果为true
  29. *
  30. * 赋值运算符: =
  31. * */
  32. //字面量: 把一个值直接赋值给一个变量
  33. //声明变量并初始化
  34. // var num=10;
  35. //
  36. // var flag=true;
  37. //
  38. // var str="哈哈哈";
  39. //
  40. // var y=10;
  41. // var n=y;

类型转换

  1. //转整数parseInt
  2. console.log(parseInt("10"));
  3. console.log(parseInt("10dsj"));
  4. console.log(parseInt("dfe10"));
  5. console.log(parseInt("1fvdsfg0"));
  6. console.log(parseInt("fd1fvdsfg0sd"));
  7. /*
  8. 输出结果
  9. 10
  10. 10
  11. NaN
  12. 1
  13. NaN
  14. */
  15. //转小数parseFloat
  16. console.log(parseFloat("10.98"));
  17. console.log(parseFloat("10.98dsj"));
  18. console.log(parseFloat("dfe10.98"));
  19. console.log(parseFloat("1fvdsfg0"));
  20. console.log(parseFloat("fd1fvdsfg0.98sd"));
  21. /*
  22. 输出结果
  23. 10.98
  24. 10.98
  25. NaN
  26. 1
  27. NaN
  28. */
  29. //转数字
  30. console.log(Number("10.98"));
  31. console.log(Number("10.98dsj"));
  32. console.log(Number("dfe10.98"));
  33. console.log(Number("1fvdsfg0"));
  34. console.log(Number("fd1fvdsfg0.98sd"));
  35. /*
  36. 输出结果
  37. 10.98
  38. NaN
  39. NaN
  40. NaN
  41. NaN
  42. */
  43. //转字符串
  44. // 两种方式:1. toString 2. String
  45. var num1=10;
  46. console.log(num1.toString());
  47. //有意义
  48. var num2;
  49. var num3=null;
  50. console.log(String(num2));
  51. console.log(String(num3));
  52. //无意义,以及为空用
  53. // 转Boolean布尔类型 重要!!!
  54. console.log(Boolean(10)); //true
  55. console.log(Boolean(0)); //false
  56. console.log(Boolean(10.43)); //true
  57. console.log(Boolean(-10)); //true
  58. console.log(Boolean("")); //false
  59. console.log(Boolean(null)); //false
  60. /*
  61. 只要结果不为0,空,未定义就位true
  62. */

进制

  1. // 十进制12
  2. var num1 = 12;
  3. // 八进制8
  4. var num2 = 010;
  5. // 十六进制20
  6. var num3 = 0x14;
  7. console.log(num1);
  8. console.log(num2);
  9. console.log(num3);
  10. //最大最小值的范围
  11. console.log(Number.MAX_VALUE);
  12. console.log(Number.MIN_VALUE);
  13. // 不要用小数验证小树
  14. var x=0.1;
  15. var y=0.2;
  16. var sum=x+y;
  17. console.log(sum);
  18. // 猜测,应该是存在小数精度问题

顺序、分支(选择)、循环(重复)

if语句

  1. // if-else
  2. // 用到转换以及获取用户输入
  3. var age=parseInt(prompt("请输入年龄"));
  4. if (age>=18){
  5. console.log("可以看电影");
  6. } else {
  7. console.log("年龄太小,不让看");
  8. }
  9. //else-else if
  10. var results = Number(prompt("请您输入成绩"));
  11. if (results > 90 && results <= 100) {
  12. console("A");
  13. } else if (results <= 90 && results > 80) {
  14. console.log("B");
  15. } else{
  16. }

switch语句

  1. var level="A";
  2. switch (level) {
  3. case "A":console.log("90~100之见");break;
  4. case "B":console.log("80~90之见");break;
  5. case "C":console.log("70~80之见");break;
  6. case "D":console.log("60~70之见");break;
  7. default:
  8. console.log("60以下");break;
  9. }

if与switch区别

  1. /*
  2. *if-else if-else if...
  3. *一般是用于范围判断
  4. *switch case
  5. * 一般用于具体值的判断
  6. *
  7. * */

while循环

  1. var sum = 0;
  2. var i = 0;
  3. while(i<=100){
  4. sum=sum+i;
  5. i++;
  6. }
  7. console.log(parseFloat(sum));

do while循环

  1. // do while循环
  2. /*
  3. * 结构
  4. * do{
  5. * 循环体
  6. * }while(条件);
  7. *至少执行一次

for循环

  1. * for循环
  2. *
  3. * 语法:
  4. * for(表达式1;表达式2;表达式3){
  5. * 循环体;
  6. * }
  7. *
  8. * 执行过程:
  9. * 先执行一次表达式1,然后判断表达式2;如果不成立则直接跳出循环
  10. * 如果表达式2成立,执行循环体的代码,结束后,跳到表达式3执行,然后跳到表达式2,判断表达式2是否成立,不成立,则跳出循环
  11. * 如果表达式2成立,则执行循环体,然后再跳到表达式3,再跳到表达式2,判断是否成立,一直如此
  12. *
  13. * for(var i=0;i<10;i++){
  14. *
  15. * }
  16. */

一元运算符

  1. ++在后,先算运算,之后再减一
  2. ++在前,先自增,之后再运算

三元表达式

  1. //求最大值
  2. var n1=20;
  3. var n2=40;
  4. var maximum=n1>n2?n1:n2;
  5. console.log(maximum);

break

  1. // 找到100~200第一个能被7整除的数字
  2. for (var i=100;i<=200;i++){
  3. if (i%7==0){
  4. console.log(i);
  5. break;
  6. }
  7. }
  8. 总结:break会跳出当前循环

continue

  1. //目的:continue 在循环中遇到continue,直接开始下一次循环
  2. // 求100~200之见所有除了个位数为3的和
  3. var sum = 0;
  4. var i = 100;
  5. while (i <= 200) {
  6. if (i % 10 == 3) {
  7. i++;
  8. continue;
  9. }
  10. sum += i;
  11. i++;
  12. }
  13. console.log(sum);

数组

  1. //数组:一组有序的数据
  2. //数组的作用:可以一次性存储多个数据
  3. //数组的定义:
  4. /*
  5. * 1. 通过构造函数创建数组
  6. * 语法:
  7. * var 数组名=new Array();
  8. * var array=new Array();//定义了一个数组
  9. * 数组的名字如果直接输出,那么直接就可以把数组中的数据显示出来,如果没有数据,就看不到数据
  10. *
  11. * var 数组名=new Array(长度);
  12. * 如果数组中没有数据,但是有长度---,数组中的每个值就是undefined
  13. */
  14. // var array=Array();
  15. // console.log(array);
  16. /*
  17. * 2. 通过自变量的方式
  18. * 语法:var 数组名=[]; 空数组
  19. *
  20. * var arr=[5];
  21. * console.log(arr);
  22. */
  23. //数组索引从0开始
  24. /*var arr=[10,20.30,40];
  25. console.log(arr[2]);
  26. // 结果40
  27. // 修改某个数组位置的值
  28. arr[1]=1000;
  29. console.log(arr[1]);
  30. // 结果1000*/
  31. // 输出数组长度
  32. // var sz=[10,20,30];
  33. // console.log(sz.length);
  1. // 遍历数组
  2. var arr=[10,20,30,40,50];
  3. for (i=0;i<arr.length;i++){
  4. console.log(arr[i]);
  5. }
  1. // 冒泡排序法
  2. // 原理:每个数和后面的数依次比较,如果大于或者小于则交换位置,最终实现排序
  3. var arr = [10, 2, 3, 54, 43, 22, 67, 90];
  4. for (i = 0; i < arr.length - 1; i++) {
  5. for (j = 0; j < arr.length - 1 - i; j++) {
  6. if (arr[j] > arr[j + 1]) {
  7. var temp = arr[j];
  8. arr[j] = arr[j + 1];
  9. arr[j + 1] = temp;
  10. }
  11. }
  12. }
  13. console.log(arr);

函数

函数1

  1. //函数:把一坨重复的代码封装,在需要的时候直接调用即可
  2. //函数的作用:代码的重用
  3. /*
  4. *
  5. * 函数的定义
  6. * 语法:
  7. *
  8. * function 函数名字(){
  9. * 函数体-----一坨重复的代码
  10. * }
  11. *
  12. * 函数的调用:
  13. *
  14. * 函数名();
  15. *
  16. *
  17. *
  18. * */
  1. //函数需要先定义,然后才能使用
  2. //函数名字:要遵循驼峰命名法
  3. //函数一旦重名,后面的会把前面的函数覆盖
  4. //Ctrl +鼠标左键---->转到定义
  5. //一个函数最好就是一个功能

函数2

  1. //函数定义,还没有执行
  2. function consoleSum(x, y) {
  3. var sum = x + y;
  4. console.log(sum);
  5. }
  6. // 传递值,函数执行
  7. sum1 = 10;
  8. sum2 = 20;
  9. consoleSum(sum1, sum2);
  1. /*
  2. * 函数参数:
  3. * 在函数定义的时候,函数名字后面的小括号里的变量就是参数,目的是函数在调用的时候,用户传进来的值操作
  4. * 此时函数定义的时候后面的小括号里的变量叫参数;写了两个变量,就有两个参数,
  5. * 在函数调用的时候,按照提示的方式,给变量赋值--->就叫传值,把这个值就传到了变量(参数)中
  6. *
  7. * 形参:函数在定义的时候小括号里的变量叫形参
  8. * 实参:函数在调用的时候小括号里传入的值叫实参,实参可以是变量也可以是值
  9. *
  10. *
  11. * */
  1. */
  2. //set:设置
  3. //get:获取
  4. //函数的返回值:在函数内部有return关键字,并且在关键字后面有内容,这个内容被返回了
  5. //当函数调用之后,需要这个返回值,那么就定义变量接收,即可
  6. /*function getSum(x,y) {
  7. return x + y;
  8. }
  9. // getSum(10,20);
  10. var ad=getSum(10,20);
  11. console.log(ad);*/
  12. /*
  13. *
  14. * 如果一个函数中有return ,那么这个函数就有返回值
  15. * 如果一个函数中没有return,那么这个函数就没有返回值
  16. * 如果一个函数中没有明确的返回值,那么调用的时候接收了,结果就是undefined
  17. * (没有明确返回值:函数中没有return,函数中有return,但是return后面没有任何内容)
  18. * 函数没有返回值,但是在调用的时候接收了,那么结果就是undefined
  19. * 变量声明了,没有赋值,结果也是undefined
  20. * 如果一个函数有参数,有参数的函数
  21. * 如果一个函数没有参数,没有参数的函数
  22. * 形参的个数和实参的个数可以不一致
  23. * return 下面的代码是不会执行的
  24. *
  25. *
  26. *
  27. * */

复习

  1. /*
  2. *
  3. * break:在循环中遇到这个关键字,直接跳出当前所在的循环
  4. * continue:在循环中遇到这个关键字,直接进行下一次循环
  5. * 数组:存储一组有序的数据,数据类型可以不一样
  6. * 数组的作用:一次性存储多个数据
  7. * 数组元素:数组中存储的每个数据,叫数组元素,存储了5个数据,有5个数组元素
  8. * 数组的长度:数组的元素的个数,叫数组的长度:数组名.length--->就是长度,数组的长度是可以改变的
  9. * 索引(下标):存储数组元素的编号,从0开始,到数组的长度-1结束
  10. * 索引是用来存储和读取数组元素的
  11. * 遍历数组:通过循环的方式找到数组中的每个数据
  12. * 冒泡排序:
  13. * 求数组的和,最大值,最小值,平均值
  14. *
  15. * 数组定义的方式:
  16. * 1. 通过构造函数定义数组
  17. * var 数组名=new Array();空数组 Array()就是构造函数
  18. * var 数组名=new Array(长度);是设置数组的初始的长度,长度是可以改变的
  19. * var 数组名=new Array(值,值,值...);定义数组并设置数组中的元素值
  20. * 2. 字面量的方式定义数组
  21. * var 数组名=[];空数组
  22. * var 数组名=[10];这个数组有一个元素,值是10,长度是1
  23. * 数组变量
  24. * for(var i=0;i<数组名.length;i++){
  25. *
  26. * }
  27. *
  28. *
  29. * 函数:把一些重复的代码封装起来,在需要的时候直接调用这个函数就可以了
  30. * 函数作用:代码的重用
  31. * 函数定义:
  32. * function 函数名(){
  33. * 函数体
  34. * }
  35. * 函数调用:
  36. * 函数名();
  37. *
  38. * 参数:形参和实参
  39. * 形参:函数定义的时候函数名字后面的小括号里的变量就是参数,是不需要写var
  40. * 实参:函数调用的时候小括号里传入的变量或者是值,都是实参
  41. * 返回值:函数中如果有return,那么这个函数就有返回值
  42. * 如果函数中没有return,那么这个函数没有返回值
  43. * 如果函数中有return,但是后面什么内容都没有,这个函数没有明确返回值
  44. * 如果一个函数没有明确的返回值,函数调用了,并且接收了,那么此时接收的结果undefined
  45. * 如果直接输出函数名字,那么是这个函数的代码
  46. * 无参数无返回值的函数
  47. * function f1(){
  48. *
  49. * }
  50. * 有参数无返回值的函数,2个参数
  51. * function f2(x,y){
  52. *
  53. * }
  54. * 无参数有返回值的函数
  55. * function f3(){
  56. * return 100;
  57. * }
  58. * 有参数有返回值的函数
  59. * function f4(x){
  60. * return "您好";
  61. * }
  62. *
  63. *
  64. *
  65. *
  66. * */
  67. //隐式全局变量
  68. // for( i=0;i<10;i++){
  69. // console.log("今天天气真好");
  70. // }

函数的其他定义形式

  1. /*
  2. * 时间:2019年4月17日 19:04:52
  3. * 目的:命名函数 匿名函数
  4. * 结果:
  5. * --------------------
  6. *
  7. *
  8. *
  9. * --------------------
  10. *
  11. **/
  12. /*
  13. * 命名函数:函数如果有名字,就是命名函数
  14. *
  15. * 匿名函数:函数如果没有名字,就是匿名函数
  16. *
  17. * 函数的另一种定义方式
  18. * 函数表达式:
  19. * 把一个函数给一个变量,此时形成了函数表达式
  20. * var 变量=匿名函数;
  21. * 例子:
  22. * var f1=function (){
  23. *
  24. * };
  25. * 如果是函数表达式,那么此时前面的变量中存储的就是一个函数,而这个变量就相当于是一个函数,就可以直接加小括号调用了
  26. * f1();
  27. *
  28. * 注意:
  29. * 函数表达式后面,赋值结束后,要加分号
  30. *
  31. *
  32. *
  33. * 函数定义:
  34. * 1. 函数声明--函数定义
  35. * function 函数名(){
  36. * 函数体
  37. * }
  38. *
  39. * */
  40. // 匿名函数
  41. // 只是没有名字,并且把函数赋给了f1
  42. /*var f1=function () {
  43. console.log("哈哈");
  44. };
  45. f1();*/
  46. // 匿名函数可以重复调用定义,不用担心函数重命名
  47. /*var f1 = function () {
  48. console.log("我是第一个");
  49. };
  50. f1();
  51. f1 = function () {
  52. console.log("我是第二个");
  53. };
  54. f1();*/
  55. // 函数的自调用,自调用函数
  56. //就是一次性,用完就没有,不担心命名冲突
  57. (function () {
  58. console.log("我是自调用函数");
  59. })();

函数作为参数使用


  1. // 函数可以作为参数使用,如果一个函数作为参数使用,那么我们可以说这个参数(函数)叫做回调函数
  2. // 只要看到一个函数作为参数使用了,那就是回调函数
  3. function f1(fn) {
  4. fn();
  5. }
  6. function f2() {
  7. console.log("这是回调参数");
  8. }
  9. f1(f2);

函数作为返回值使用

  1. function f1() {
  2. return function () {
  3. console.log("返回值");
  4. }
  5. }
  6. var ff = f1();
  7. ff();

函数也是一种数据类型

  1. function f() {
  2. }
  3. console.log(typeof f);
  4. // 结果,函数类型function

冒泡排序

  1. //从大到小
  2. var arr = [10, 20, 3, 4, 5, 45];
  3. // 冒泡排序,肯定有进行比较,之后交换数据
  4. //进行轮数循环
  5. for (var i = 0; i < arr.length - 1; i++) {
  6. //进行每轮比较
  7. for (var j = 0; j < arr.length - i - 1; j++) {
  8. if (arr[j] > arr[j + 1]) {
  9. // 利用第三方变量交换数据
  10. var temp;
  11. temp = arr[j];
  12. arr[j] = arr[j + 1];
  13. arr[j + 1] = temp;
  14. }
  15. }
  16. }
  17. console.log(arr);

域解析

  1. /*
  2. * 结果:预解析可以吧一些定义代码提到前面
  3. * --------------------
  4. * 预解析:就是在解析代码之前
  5. * 预解析做什么事?
  6. * 把变量的声明提前了----提前到当前所在的作用域的最上面
  7. * 函数的声明也会被提前---提前到当前所在的作用域的最上面
  8. * 先提升var,在提升function
  9. * 预解析会分段(多对script标签中函数重名,预解析不会冲突)
  10. * --------------------
  11. *
  12. **/

作用域

  1. //作用域:使用范围
  2. /*
  3. *
  4. * 全局变量:声明的变量是使用var声明的,那么这个变量就是全局变量,全局变量可以在页面的任何位置使用
  5. * 除了函数以外,其他的任何位置定义的变量都是全局变量
  6. * 局部变量:在函数内部定义的变量,是局部变量,外面不能使用
  7. * 全局变量,如果页面不关闭,那么就不会释放,就会占空间,消耗内存
  8. *
  9. * 全局作用域:全局变量的使用范围
  10. * 局部作用域:局部变量的使用范围
  11. *
  12. * 块级作用域:一对大括号就可以看成是一块,在这块区域中定义的变量,只能在这个区域中使用,但是在js中在这个块级作用域中定义的变量,外面也能使用;
  13. * 说明:js没有块级作用域,只有函数除外
  14. *
  15. * 隐式全局变量:声明的变量没有var,就叫隐式全局变量
  16. * 全局变量是不能被删除的,隐式全局变量是可以被删除的
  17. * 定义变量使用var是不会被删除的,没有var是可以删除的
  18. *
  19. *
  20. * */
  21. // 在函数作用域内加var定义的变量是局部变量,不加var定义的就成了全局变量。
  22. // function f1() {
  23. // number=1000;//是隐式全局变量
  24. // }
  25. // f1();
  26. // console.log(number);

作用域链

  1. /*
  2. * 时间:2019年4月6日 12:26:11
  3. * 目的:作用域链
  4. * 结果:函数套函数,如果函数里面找不到变量,就去上一级找,直到找不到报错
  5. * --------------------
  6. *
  7. *
  8. *
  9. * --------------------
  10. *
  11. **/
  12. var num=10;
  13. function f1() {
  14. var num=20;
  15. function f2() {
  16. var num=30;
  17. function f3() {
  18. var num=50;
  19. console.log(num);
  20. }
  21. f3();
  22. }
  23. f2();
  24. }
  25. f1();

arguments伪数组

  1. /*
  2. * 时间:2019年4月17日 19:04:52
  3. * 目的:arguments //意思:参数
  4. * 结果:获取函数在调用的时候,传入了几个参数
  5. * --------------------
  6. * 使用arguments可以获得每个传入对象的值
  7. *
  8. *
  9. * --------------------
  10. *
  11. **/
  12. /*function f1() {
  13. console.log(arguments.length);
  14. console.log(arguments);
  15. }
  16. f1(10,20,30,40);*/
  17. // 计算n个数字的和
  18. function nSum() {
  19. var sum=0;
  20. //把arguments当成数组使用 //注意:是伪数组
  21. for (var i=0;i<arguments.length;i++){
  22. sum+=arguments[i];
  23. }
  24. return sum;
  25. }
  26. console.log(nSum(10,20,30,40));

复习

  1. /*
  2. * 复习:
  3. * 函数:把一些重复的代码封装在一个地方,在需要的时候直接调用这个地方的代码就可以了
  4. *
  5. * 函数作用:代码重用
  6. *
  7. * 函数的参数:
  8. * 1.形参:函数定义的时候,函数名字后面的小括号里的变量
  9. * 2.实参:函数调用的时候,函数名字后面的小括号里的变量或者值
  10. *
  11. * 返回值:
  12. * 函数中有return,函数有返回值
  13. * 函数中没有return,函数没有返回值
  14. * 没有明确返回值:函数中没有return或者return后面没有任何内容
  15. * 如果一个函数没有明确的返回值,接收这个函数,结果是undefined
  16. *
  17. * 无参数无返回值的函数
  18. * 无参数有返回值的函数
  19. * 有参数无返回值的函数
  20. * 有参数有返回值的函数
  21. *
  22. * arguments----->可以获取函数调用的时候,传入的实参的个数
  23. * arguments是一个对象,是一个伪数组
  24. * arguments.length--->是实参的个数
  25. * arguments[索引]---->实参的值
  26. *
  27. * 作用域:变量的使用范围
  28. * 全局作用域:全局变量在任何位置都可以使用的范围
  29. * 局部作用域:局部变量只能在某个地方使用---函数内
  30. * 作用域链:在一个函数中使用一个变量,先在该函数中搜索这个变量,找到了则使用,找不到则继续向外面找这个变量,找到则使用,一直找到全局作用域,找不到则是undefined
  31. * 全局变量:只要是在函数外面声明的变量都可以看成或者是理解成是全局变量
  32. * 局部变量:在函数中定义的变量
  33. *
  34. * 预解析:在执行代码之前做的事情
  35. * 变量的声明和函数的声明被提前了,变量和函数的声明会提升到当前所在的作用域的最上面
  36. * 函数中的变量声明,会提升到该函数的作用域的最上面(里面)
  37. * 如果有多对的script标签都有相同名字的函数,预解析的时候是分段的,互不影响
  38. *
  39. *
  40. *
  41. *
  42. *
  43. *
  44. * */

对象

简单类型和复杂类型

  1. //原始数据类型: number,string,boolean,undefined, null,object
  2. //基本类型(简单类型),值类型: number,string,boolean
  3. //复杂类型(引用类型):object
  4. //空类型:undefined,null
  5. //值类型的值在哪一块空间中存储? 栈中存储
  6. //引用类型的值在哪一块空间中存储?对象在堆上存储,地址在栈上存储
  7. //var num=10;//值类型,值在栈上
  8. //var obj={};//复杂类型,对象在堆,地址(引用)在栈
  9. //值类型之间传递,传递的是值
  10. //引用类型之间传递,传递的是地址(引用)
  11. //值类型作为函数的参数,传递的是值
  12. //引用类型作为函数的参数,传递的是地址

编程思想的概述

  1. //编程思想: 把一些生活中做事的经验融入到程序中
  2. //面向过程: 凡事都要亲历亲为,每件事的具体过程都要知道,注重的是过程
  3. //面向对象: 根据需求找对象,所有的事都用对象来做,注重的是结果
  4. /*
  5. *
  6. *
  7. * 面向对象特性:封装,继承,多态 (抽象性)
  8. * js不是面向对象的语言,但是可以模拟面向对象的思想
  9. * js是一门基于对象的语言:
  10. * 万物皆对象:---------->程序猿 程旭媛
  11. *
  12. * * 什么是对象?
  13. * 看的见,摸得到,具体特指的某个东西
  14. *
  15. * 找对象
  16. * 描述找对象
  17. * 文字描述找对象
  18. * 小明牵着小黄去逛街
  19. * 一台电视机正在播放影片
  20. *
  21. *
  22. *
  23. *
  24. * 分析对象有什么特点:特征和行为
  25. *
  26. * 对象:有特征和行为,具体特指的某一个事物
  27. *
  28. *
  29. *
  30. * 对象:有属性和方法,具体特指的某个事物
  31. *
  32. *
  33. *
  34. *
  35. * 没有对象
  36. *
  37. *
  38. * 创建对象
  39. *
  40. *
  41. *https://www.codecombat.cn/play/dungeon
  42. *
  43. *
  44. *
  45. * */

创建对象的图解

  1. //1 调用构造函数创建对象
  2. var obj=new Object();
  3. //2. 自定义构造函数创建对象
  4. //自定义构造函数
  5. function Person(name,age) {
  6. this.name=name;
  7. this.age=age;
  8. this.sayHi=function () {
  9. console.log("您好,我叫:"+this.name);
  10. };
  11. }
  12. //创建对象----实例化一个对象,并初始化
  13. var per=new Person("小明",20);
  14. per.name="张三";
  15. //四件事:
  16. /*
  17. * 1. 开辟空间,存储创建的新的对象
  18. * 2. 把this设置为当前的对象
  19. * 3. 设置对象的属性和方法的值
  20. * 4. 返回创建后新的对象
  21. *
  22. *
  23. * */
  24. // 内存分为栈和堆

调用系统的构造函数创建对象

  1. //创建对象三种方式:
  2. /*
  3. *
  4. * 1.调用系统的构造函数创建对象
  5. * var 变量名= new Object(); Object 是系统的构造函数 Array
  6. *
  7. * 2.自定义构造函数创建对象(结合第一种和需求通过工厂模式创建对象)
  8. *
  9. *
  10. * 3.字面量的方式创建对象
  11. *
  12. *
  13. * */
  14. //构造函数就是首字母大写,后面小写,如Array,Object
  15. //第一种创建对象的方式
  16. //小苏举例子:
  17. //实例化对象
  18. var obj = new Object();
  19. //对象有特征---属性和行为---方法
  20. //添加属性-----如何添加属性? 对象.名字=值;
  21. obj.name = "小苏";
  22. obj.age = 38;
  23. obj.sex = "女";
  24. //添加方法----如何添加方法? 对象.名字=函数;
  25. obj.eat = function () {
  26. console.log("我喜欢吃油炸榴莲凉拌臭豆腐和大蒜");
  27. };
  28. obj.play = function () {
  29. console.log("我喜欢玩飞机模型");
  30. };
  31. obj.cook = function () {
  32. console.log("切菜");
  33. console.log("洗菜");
  34. console.log("把菜放进去");
  35. console.log("大火5分钟");
  36. console.log("出锅");
  37. console.log("凉水过一下");
  38. console.log("放料,吃");
  39. };
  40. console.log(obj.name);//获取--输出了
  41. console.log(obj.age);
  42. console.log(obj.sex);
  43. //方法的调用
  44. obj.eat();
  45. obj.play();
  46. obj.cook();

调用自定义构造函数创建对象

  1. //自定义构造函数创建对象,我要自己定义一个构造函数,自定义构造函数,创建对象
  2. //函数和构造函数的区别;名字是不是大写(首字母是大写)
  3. function Dog(name, age) {
  4. this.name = name;
  5. this.age = age;
  6. this.hello = function () {
  7. console.log("你好我叫" + this.name + "今年" + this.age);
  8. }
  9. }
  10. var dog = new Dog("小明", 18);
  11. var cat = new Dog("小军", 19);
  12. dog.hello();
  13. cat.hello();
  14. console.log(Dog() instanceof dog);

工厂模式创建对象

  1. /*
  2. *
  3. * 如何获取该变量(对象)是不是属于什么类型的?
  4. * 语法:
  5. * 变量 instanceof 类型的名字----->布尔类型,true就是这种类型,false不是这种类型
  6. * 在当前的对象的方法中,可以使用this关键字代表当前的对象
  7. *
  8. *
  9. * */
  10. //对象不能分辨出到底是属于什么类型?
  11. //如何一次性创建多个对象?把创建对象的代码封装在一个函数中
  12. //工厂模式创建对象
  13. factoryCreation=function (name,age) {
  14. var obg=new Object();
  15. obg.name=name;
  16. obg.age=age;
  17. obg.greet=function () {
  18. console.log("你好,我叫"+this.name+"今年"+this.age+"岁了");
  19. };
  20. obg.greet();
  21. };
  22. factoryCreation("小军",15);
  23. factoryCreation("小明",16);
  24. //工厂模式就是提前定义封装好,到时候直接传内容用就行

内置对象

  1. /*
  2. 时间:2019年5月24日 20:20:00
  3. 目的关于对象
  4. ---------------------
  5. 在Webstorm中输出的结果是:
  6. ---------------------
  7. */
  8. // js学习中的三种对象
  9. /*
  10. * 1.内置对象---------js系统自带的对象
  11. * 2.自定义对象-------自己定义的构造函数创建的对象
  12. * 3.浏览器对象-------BOM的时候讲
  13. * */
  14. // 如何验证变量是不是对象?
  15. console.log(Array instanceof Object);
  16. var obj={};
  17. console.log(obj instanceof Object);
  18. // 内置对象
  19. /*
  20. * Math
  21. * Date
  22. * String
  23. * Array
  24. * */

设置和获取属性的另一种方法

  1. 通过中括号以及双引号的方式调用
  2. //自定义构造函数
  3. function People(name, age) {
  4. this.name = name;
  5. this.age = age;
  6. this.eat = function () {
  7. console.log("拿筷子");
  8. console.log("吃");
  9. };
  10. }
  11. var people_1 = new People("小明", 18);
  12. //点语法
  13. console.log(people_1.name);
  14. console.log(people_1.age);
  15. people_1.eat();
  16. //中括号
  17. console.log(people_1["name"]);
  18. console.log(people_1["age"]);
  19. people_1["eat"]();

自变量的方式创建对象

  1. // 原来方式
  2. /*
  3. // 调用构造函数
  4. var obj = new Object();
  5. obj.name = "小米";
  6. //自定义构造函数
  7. function Obg(name, age) {
  8. this.name = name;
  9. this.obg = obg;
  10. }
  11. var obg = new Obg("小米", 18);
  12. */
  13. // 自变量
  14. /*var obg = {};
  15. obg.name = "小明";
  16. obg.age = 18;
  17. obg.ganHuo = function () {
  18. console.log(this.name + "会干活");
  19. };
  20. console.log(obg.name);
  21. console.log(obg.age);
  22. obg.ganHuo();*/
  23. /*var obg = {
  24. name: "小明",
  25. age: 18,
  26. ganHuo: function () {
  27. console.log(this.name + "会干活");
  28. }
  29. };
  30. console.log(obg.name);
  31. console.log(obg.age);
  32. obg.ganHuo();*/
  33. // 现在可以暂时理解为只要有花括号的就是对象

自定义构造函数创建对象做了四件事

  1. 目的:理解自定义对象,系统做了什么事情
  2. //自定义构造函数创建对象,我要自己定义一个构造函数,自定义构造函数,创建对象
  3. //函数和构造函数的区别;名字是不是大写(首字母是大写)
  4. /*function Dog(name, age) {
  5. this.name = name;
  6. this.age = age;
  7. this.hello = function () {
  8. console.log("你好我叫" + this.name + "今年" + this.age);
  9. }
  10. }
  11. var dog = new Dog("小明", 18);
  12. var cat = new Dog("小军", 19);
  13. dog.hello();*/
  14. /*
  15. *
  16. * 1. 在内存中开辟(申请一块空闲的空间)空间,存储创建的新的对象
  17. * 2. 把this设置为当前的对象
  18. * 3. 设置对象的属性和方法的值
  19. * 4. 把this这个对象返回
  20. *
  21. *
  22. * */
  23. //通过自定义构造函数实现下面的例子:
  24. //创建一个图片的对象,图片有宽,有高,有大小(4M),图片可以展示内容
  25. /*function Tupian(kuan,gao,daxiao) {
  26. this.kuan=kuan;
  27. this.gao=gao;
  28. this.daxiao=daxiao;
  29. this.xingwei=function () {
  30. console.log("展示内容");
  31. };
  32. }
  33. var tuPian=new Tupian("500px","200px","4M");
  34. console.log(tuPian.kuan);
  35. console.log(tuPian.gao);
  36. console.log(tuPian.daxiao);
  37. tuPian.xingwei();*/

总结对象

  1. //字面量创建对象的缺陷: 一次性的对象
  2. // var obj={
  3. // name:"小明",
  4. // age:38,
  5. // sex:"女"
  6. // };
  7. // obj.name="小三";
  8. // console.log(obj.name);
  9. //点语法: 对象.名字=值; 对象.名字=函数;
  10. //没有什么点,就有了
  11. /*
  12. *
  13. * js是一门什么样的语言?
  14. * 是一门解释性的语言
  15. * 是一门脚本语言
  16. * 是一门弱类型语言,声明变量都用var
  17. * 是一门基于对象的语言
  18. * 是一门动态类型的语言:
  19. * 1. 代码(变量)只有执行到这个位置的时候,才知道这个变量中到底存储的是什么,如果是对象,就有对象的属性和方法,如果是变量就是变量的作用
  20. * 2. 对象没有什么,只要点了,通过点语法,那么就可以为对象添加属性或者方法
  21. *
  22. *
  23. *
  24. * */

json格式的数据

  1. //对象:有属性和方法,特指的某个事物
  2. //对象:一组无序属性的集合的键值对,属性的值可以是任意的类型
  3. // function Dog(name) {
  4. // this.name=name;
  5. // }
  6. // function Person(name,age) {
  7. // this.age=age;
  8. // this.name=name;
  9. // this.sex=true;
  10. // this.dog={};
  11. // this.play=function () {
  12. // console.log("喜欢玩游戏");
  13. // };
  14. // }
  15. //
  16. // var sex=false;//男
  17. // console.log(sex?"男":"女");
  18. //JSON格式的数据:一般都是成对的,是键值对,
  19. //json也是一个对象,数据都是成对的,一般json格式的数据无论是键还是值都是用双引号括起来的
  20. // var obj={
  21. // name:"小明"
  22. // };
  23. /*var json = {
  24. "name": "小明",
  25. "age": "10",
  26. "sex": "男"
  27. };*/
  28. //遍历对象,是不能通过for循环遍历,无序
  29. //key是一个变量,这个变量中存储的是该对象的所有的属性的名字
  30. /* for (var key in json) {
  31. console.log(key + "===========" + json[key]);
  32. }*/
  33. // var key="name";
  34. // console.log(json[key]);
  35. //可以通过for-in循环
  36. //
  37. // for(var key in json){
  38. // //console.log(key);//json对象中的属性的名字
  39. // console.log(json[key]);
  40. // }
  41. //对象中确实有这个属性对象.属性名字 或者对象[属性名字]
  42. //一个一个的遍历出来
  43. // var arr=[10,20,30];
  44. // for(var i=0;i<arr.length;i++){
  45. // console.log(arr[i]);
  46. // }
  47. //json数据练习
  48. var json= {
  49. "name": "小军",
  50. "sex": "男",
  51. "age": "16",
  52. "eat": function () {
  53. console.log("会吃饭");
  54. }
  55. };
  56. for(var i in json){
  57. console.log(i+"---------"+json[i]);
  58. }

Math对象

  1. */
  2. // Math 是一个内置对象, 它具有数学常数和函数的属性和方法。不是一个函数对象。
  3. //MDN----在线的帮助文档
  4. //实例对象:通过构造函数创建出来,实例化的对象
  5. //静态对象:不需要创建,直接就是一个对象,方法(静态方法)直接通过这个对象名字调用,
  6. //实例方法必须通过实例对象调用
  7. //静态方法必须通过大写的对象调用
  8. /*
  9. * Math.PI---------------------π
  10. * Math.E----------------------常数的底数
  11. * Math.abs(值)----------------绝对值
  12. * Math.ceil(值)---------------向上取整
  13. * Math.floor(值)--------------向下取整
  14. * Math.max(值,值,值)-----------找一组数字中的最大值
  15. * Math.min(值,值,值)-----------找一组数字中的最小值
  16. * Math.pow(x,y)---------------计算x的y次幂
  17. * Math.sqrt(值)---------------计算数字的平方根
  18. * Math.random()---------------产生随机数*/
  19. // 实验
  20. console.log(Math.PI); //打印π
  21. console.log(Math.abs(-10)); //打印绝对值
  22. console.log(Math.ceil(12.02)); //向上取整
  23. console.log(Math.floor(12.99)); //向下取整
  24. console.log(Math.fround(3.1)); //把小数转换成计算机存储的单精度小数 //实验,不推荐使用
  25. console.log(Math.max(10, 20, 30, 2, 1)); //找一组数字中的最大值
  26. console.log(Math.min(10, 20, 30, 2, 1)); //找一组数字中的最小值
  27. console.log(Math.pow(10, 2)); //Math.pow()计算x的y次幂
  28. console.log(Math.sqrt(16)); //计算数字的平方根
  29. console.log(Math.random()); //产生随机数
  30. // 范围0~1之见,如果需要产生整数的话需要这样
  31. console.log(parseInt(Math.random()*5)+1); //0~5之见
  32. console.log(parseInt(Math.random()*10)+1); //0~10之见

复习

  1. /*
  2. * 复习
  3. * 编程思想:
  4. * 面向过程:凡事亲力亲为,所有的事情的过程都要清楚,注重的是过程
  5. * 面向对象:提出需求,找到对象,对象解决这个问题,我们要结果,注重的是结果
  6. *
  7. * 面向对象的特性:封装,继承,多态,(抽象性)
  8. *
  9. * JS是一门什么样的语言?
  10. * 是一门解释性的语言
  11. * 是一门脚本语言
  12. * 是一门弱类型的语言
  13. * 是一门基于对象的语言
  14. * 是一门动态类型的语言
  15. *
  16. * 对象:有属性和方法,具体特指的某个事物
  17. * 对象:js中就是一组无序的属性的集合
  18. * 属性----特征
  19. * 方法----行为
  20. * 创建的对象的方式:
  21. * 1.通过调用系统的构造函数创建对象 new Object()
  22. * var obj1=new Object();
  23. * 2.自定义构造函数创建对象
  24. * var obj2=new 自定义构造函数();
  25. * 3.字面量的方式创建对象
  26. * var obj3={};
  27. * 变量 instanceof 对象------->布尔类型,判断这个变量是不是这个类型的
  28. *
  29. * JSON格式的数据,都是键值对,成对的数据
  30. * var obj={
  31. * name:"小明"
  32. * };
  33. * var json={
  34. * "name":"小明"
  35. * };
  36. *
  37. * json的数据实际上就是格式化后的一组字符串的数据
  38. *
  39. * 对象设置属性的值的写法
  40. * 对象.属性名字=值;----点语法
  41. * 对象["属性的名字"]=值;-----
  42. *
  43. * 对象获取属性的值的写法
  44. * 对象.属性
  45. * 对象["属性"]
  46. *
  47. * 遍历对象
  48. * for(var key in 对象){ key---是一个变量,这个变量中存储的是遍历的对象的属性的名字
  49. *
  50. * }
  51. *
  52. *
  53. * 原始数据类型:number,string,boolean,null,undefined,object
  54. * 基本类型(简单类型,值类型):number,string,boolean
  55. * 复杂类型(引用类型):object
  56. * 空类型:undefined,null
  57. *
  58. * 基本类型的值在栈上
  59. * 复杂类型的对象在堆上,地址(引用)在栈上
  60. *
  61. * 值类型之间传递的是值
  62. * 引用类型之间传递的是引用(地址)
  63. *
  64. *
  65. * 对象分三种:内置对象,自定义对象,浏览器对象
  66. * 内置对象:系统提供的
  67. * 自定义对象:自己写的
  68. * 浏览器对象:浏览器的
  69. *
  70. * Math 是一个对象,但是不是一个函数
  71. * Math对象下的属性和方法都是静态
  72. *
  73. * 方法:
  74. * Math.ceil()---向上取整
  75. * Math.floor()---向下取整
  76. * Math.Pi----圆周率的值
  77. * Math.Max()---一组数字中的最大值
  78. * Math.Min()---一组数字中的最小值
  79. * Math.abs()----绝对值
  80. * Math.random---随机数字
  81. * Math.sqrt()----开平方
  82. * Math.pow()----一个数字的多少次幂
  83. *
  84. *
  85. *
  86. *
  87. * new 的执行过程:----->new的时候,系统做了什么事?
  88. * 1. 开辟空间,存储创建的新的对象
  89. * 2. 把this设置为当前的对象
  90. * 3. 设置属性和方法的值
  91. * 4. 返回当前的新的对象
  92. *
  93. *
  94. *
  95. *
  96. *
  97. *
  98. *
  99. *
  100. *
  101. *
  102. *
  103. *
  104. *
  105. *
  106. *
  107. *
  108. *
  109. * */
  110. //
  111. // var obj={
  112. // name:"牙擦苏",
  113. // age:20,
  114. // sex:"男",
  115. // height:198,
  116. // weight:55
  117. // };
  118. // var objs={
  119. // "name":"值"
  120. // };
  121. // //遍历对象
  122. // for(var key in obj){
  123. // console.log(key+"======>"+obj[key]);
  124. // }
  125. var obj = {
  126. "name": "牙擦苏",
  127. "age": 20,
  128. "sex": "男",
  129. "height": 198,
  130. "weight": 55
  131. };
  132. var objs = {
  133. "name": "值"
  134. };
  135. //遍历对象
  136. for (var key in obj) {
  137. console.log(key + "======>" + obj[key]);
  138. }

格式化日期时间

  1. 目的:自己封装函数按照中国人的方式显示日期时间
  2. console.log(getDate(new Date()));

js部分

  1. /**
  2. * 获取指定的时间
  3. * @param dt 日期的对象
  4. * @returns {string} 返回的是字符串的时间
  5. */
  6. function getDate(dt) {
  7. //获取年
  8. var year = dt.getFullYear();
  9. //获取月
  10. var month = dt.getMonth() + 1;
  11. //获取日
  12. var day = dt.getDate();
  13. //获取小时
  14. var hour = dt.getHours();
  15. //获取分钟
  16. var minutes = dt.getMinutes();
  17. //获取秒
  18. var seconds = dt.getSeconds();
  19. month = month < 10 ? "0" + month : month;
  20. day = day < 10 ? "0" + day : day;
  21. hour = hour < 10 ? "0" + hour : hour;
  22. minutes = minutes < 10 ? "0" + minutes : minutes;
  23. seconds = seconds < 10 ? "0" + seconds : seconds;
  24. return year + "年" + month + "月" + day + "日 " + hour + ":" + minutes + ":" + seconds;
  25. }

基本包装类型

  1. //基本包装类型
  2. //普通变量不能直接调用属性或者方法
  3. //对象可以直接调用属性和方法
  4. //基本包装类型:本身是基本类型,但是在执行代码的过程中,如果这种类型的变量调用了属性或者是方法,那么这种类型就不再是基本类型了,而是基本包装类型,这个变量也不是普通的变量了,而是基本包装类型对象
  5. //string number boolean
  6. // var str="hello";
  7. // str=str.replace("ll","HH");
  8. // console.log(str);
  9. // var str=new String("hello");
  10. // str=str.replace("ll","HH");
  11. // console.log(str);
  12. // str=null;
  13. // var num=10;//number---->
  14. // console.log(num.toString());
  15. //如果是一个对象&&true,那么结果是true
  16. //如果是一个true&&对象,那么结果是对象
  17. // var flag=new Boolean(false);
  18. // var result=true&&flag;
  19. // console.log(result);
  20. // var num=10;
  21. // var num2=Number("10");//转换,没有new---类型转
  22. // var num3=new Number("10");//基本包装类型

实现系统Max的方法

  1. // 实现系统的Max方法
  2. function myMax() {
  3. // 添加一个方法
  4. this.max = function () {
  5. var max = arguments[0];
  6. for (var i = 0; i < arguments.length; i++) {
  7. if (max < arguments[i]) {
  8. max = arguments[i];
  9. }
  10. }
  11. return max;
  12. };
  13. }
  14. //实例对象
  15. var max = new myMax();
  16. var max1 = max.max(10, 20, 30, 40);
  17. console.log(max1);

字符串的案例

  1. /*var str="我想要截取的字符串";
  2. var key="截取";
  3. //先获取想要截取的字符串索引的位置
  4. index=str.indexOf(key);
  5. //从指定的位置开始截取,截取两个即可
  6. str=str.substr(index,2);
  7. console.log(str);*/
  8. //找到字符串中所有e出现的位置
  9. /*var str="hello oed eye age";
  10. var index=0;
  11. var key="e";
  12. while ((index=str.indexOf(key,index))!==-1){
  13. console.log(index);
  14. index+=key.length;
  15. }*/
  16. //案例3:找到这个字符串中每个字符串出现了多少次
  17. var str = "zhaoyazhAozhaoGezifuChuan";
  18. str = str.toLocaleLowerCase();
  19. var obj = {};
  20. for (var i = 0; i < str.length; i++) {
  21. var key = str[i];
  22. if (obj[key]) {
  23. obj[key]++;
  24. } else {
  25. obj[key] = 1;
  26. }
  27. }
  28. for (key in obj){
  29. console.log(key+"出现了"+obj[key]);
  30. }
  31. /*//案例3:找到这个字符串中每个字符串出现了多少次
  32. var str3 = "whatOareYyouYnoYshaHleiHoHmyHgod";
  33. //第一步:把所有的字母全部变成小写
  34. str3 = str3.toLocaleLowerCase();
  35. //第二步:创建一个空对象,目的:把字母作为键,次数作为值
  36. var obj = {};
  37. //第三步,遍历字符串,获取每个字母
  38. for (var i = 0; i < str3.length; i++) {
  39. //判断obj这个对象中有没有这个字母(字母---键)
  40. var key = str3[i];//每个字母
  41. if (obj[key]) {//判断obj中有没有这个键
  42. //对象中有这个字母了
  43. obj[key]++;
  44. } else {
  45. //对象中没有这个字母,那就把字母加到对象中,并且给这个字母一个出现的次数,默认1次
  46. obj[key] = 1;
  47. }
  48. }
  49. //遍历对象,显示每个字母的次数
  50. for(var key in obj){
  51. console.log(key+"这个字母出现了"+obj[key]+"次");
  52. }*/
  53. /*// /把对象["属性名字"]--->放在if的判断中即可----判断对象中有没有这个属性
  54. var obj={
  55. "sex":"男"
  56. };
  57. if (obj["sex"]){
  58. console.log("有");
  59. } else {
  60. console.log("没有");
  61. }*/

总结Date对象

  1. var dt=new Date();
  2. dt.getFullYear();//年
  3. dt.getMonth();//月-----从0开始
  4. dt.getDate();//日
  5. dt.getDay();//星期----从0开始
  6. dt.toDateString();//日期
  7. dt.toLocaleDateString();//日期
  8. dt.toTimeString();//时间
  9. dt.toLocaleTimeString();//时间
  10. dt.valueOf();//毫秒
  11. /*
  12. // 不支持HTML5的浏览器,可以用下面这种方式
  13. var now = + new Date(); // 调用 Date对象的valueOf()
  14. */

Array对象的方法

  1. /*
  2. * Array.isArray(对象)---->判断这个对象是不是数组
  3. *.concat(数组,数组,数组,...) 组合一个新的数组
  4. *.every(函数)--返回值是布尔类型,函数作为参数使用,函数中有三个参数,第一个参数是元素的值,第二个参数是索引值,第三个参数是原来的数组(没用) 如果这个数组中的每个元素的值都符合条件,最后才返回的是true
  5. *.filter(函数);返回的是数组中每一个元素都复合条件的元素,组成了一个新的数组
  6. * .push(值);--->把值追加到数组中,加到最后了---返回值也是追加数据之后的数组长度
  7. * .pop();--->删除数组中最后一个元素,返回值就是删除的这个值
  8. * .shift();--->删除数组中第一个元素,返回值就是删除的这个值
  9. * .unshift();--->向数组的第一个元素前面插入一个新的元素,----返回值是插入后的程度
  10. * .forEach(函数)方法---遍历数组用---相当于for循环
  11. * .indexOf(元素值);返回的是索引,没有则是-1
  12. * .join("字符串");----返回的是一个字符串
  13. * .map(函数);--->数组中的每个元素都要执行这个函数,把执行后的结果重新的全部的放在一个新的数组中
  14. * .reverse();----->反转数组
  15. * .sort();---排序的,可能不稳定,如果不稳定,请写MDN中的那个固定的代码
  16. * .arr.slice(开始的索引,结束的索引);把截取的数组的值放在一个新的数组中,但是不包含结束的索引对应的元素值
  17. * .splice(开始的位置,要删除的个数,替换的元素的值);一般是用于删除数组中的元素,或者是替换元素,或者是插入元素
  18. * */
  19. // Array.isArray(对象)---->判断这个对象是不是数组
  20. // var arr=[];
  21. // console.log(arr instanceof Array);
  22. // console.log(Array.isArray(arr));
  23. // .concat(数组,数组,数组,...) 组合一个新的数组
  24. // var arr1=[10,20,30];
  25. // var arr2=[40,50,60];
  26. // var arr3=arr1.concat(arr2);
  27. // console.log(arr3);
  28. // .every(函数)--返回值是布尔类型,函数作为参数使用,函数中有三个参数,第一个参数是元素的值,第二个参数是索引值,第三个参数是原来的数组(没用) 如果这个数组中的每个元素的值都符合条件,最后才返回的是true
  29. // var arr = [10, 20, 30];
  30. // var result = arr.every(function (ele, index) {
  31. // return ele > 10;
  32. // });
  33. // console.log(result);
  34. //.filter(函数);返回的是数组中每一个元素都复合条件的元素,组成了一个新的数组
  35. // var arr = [10, 20, 30, 40];
  36. // var result = arr.filter(function (ele) {
  37. // return ele > 20;
  38. // });
  39. // console.log(result);
  40. // .push(值);--->把值追加到数组中,加到最后了---返回值也是追加数据之后的数组长度
  41. // var arr=[10,20,30];
  42. // arr.push(100);
  43. // console.log(arr);
  44. // .pop();--->删除数组中最后一个元素,返回值就是删除的这个值
  45. // var arr=[10,20,30];
  46. // arr.pop();
  47. // console.log(arr);
  48. // .shift();--->删除数组中第一个元素,返回值就是删除的这个值
  49. // var arr=[10,20,30];
  50. // arr.shift();
  51. // console.log(arr);
  52. // .unshift();--->向数组的第一个元素前面插入一个新的元素,----返回值是插入后的程度
  53. // var arr=[10,20,30];
  54. // arr.unshift(100);
  55. // console.log(arr);
  56. // .forEach(函数)方法---遍历数组用---相当于for循环
  57. // var arr=[10,20,30];
  58. // arr=arr.forEach(function (ele,index) {
  59. // console.log(ele+"------->"+index);
  60. // });
  61. // .indexOf(元素值);返回的是索引,没有则是-1
  62. // var arr=[10,20,30];
  63. // console.log(arr.indexOf(20));
  64. // .join("字符串");----返回的是一个字符串
  65. // var arr=[10,20,30];
  66. // console.log(arr.join("|"));
  67. // .map(函数);--->数组中的每个元素都要执行这个函数,把执行后的结果重新的全部的放在一个新的数组中
  68. // var arr=[10,20,30];
  69. // var newArr=arr.map(Math.sqrt);
  70. // console.log(newArr);
  71. // .reverse();----->反转数组
  72. // var arr=[10,20,30];
  73. // var newArr=arr.reverse();
  74. // console.log(newArr);
  75. //.sort();---排序的,可能不稳定,如果不稳定,请写MDN中的那个固定的代码
  76. // var arr = [10, 1, 2, 3, 500, 43];
  77. // var newArr = arr.sort(function (a, b) {
  78. // if (a > b) {
  79. // return 1;
  80. // } else if (a == b) {
  81. // return 0;
  82. // } else {
  83. // return -1;
  84. // }
  85. // });
  86. // console.log(newArr);
  87. // .arr.slice(开始的索引,结束的索引);把截取的数组的值放在一个新的数组中,但是不包含结束的索引对应的元素值
  88. // var arr=[10,20,30,40,50,60];
  89. // var newArr=arr.slice(2,3);
  90. // console.log(newArr);
  91. // .splice(开始的位置,要删除的个数,替换的元素的值);一般是用于删除数组中的元素,或者是替换元素,或者是插入元素
  92. // var arr=[10,20,30];
  93. // arr.splice(1,0,"你好");
  94. // console.log(arr);

Date对象

  1. //创建实例对象
  2. // //当前时间----当前服务器
  3. // var dt=new Date();
  4. // console.log(dt);
  5. // //自己输入时间
  6. // dt=new Date("2017/1/1");
  7. // console.log(dt);
  8. // //输出从1970年距今毫秒
  9. // dt=Date.now();
  10. // console.log(dt);
  11. var dt = new Date();
  12. // 获取年份
  13. console.log(dt.getFullYear());
  14. // 获取月份
  15. console.log(dt.getMonth()); //是从0开始,真实月份需要加1
  16. // 获取日期
  17. console.log(dt.getDate());
  18. // 获取小时
  19. console.log(dt.getHours());
  20. // 获取分钟
  21. console.log(dt.getMinutes());
  22. // 获取秒
  23. console.log(dt.getSeconds());
  24. // 获取星期
  25. console.log(dt.getDay());//是从0开始,0是星期日
  26. console.log(dt);
  27. //转成字符串
  28. console.log(dt.toString());
  29. console.log(dt.toDateString());//英文的----日期
  30. console.log(dt.toLocaleDateString());//数字格式----日期
  31. console.log(dt.toTimeString());//小时分钟秒
  32. console.log(dt.toLocaleTimeString());//小时分钟秒

String对象

  1. /*
  2. *
  3. * String---->是一个对象
  4. * 字符串可以看成是字符组成的数组,但是js中没有字符类型
  5. * 字符是一个一个的,在别的语言中字符用一对单引号括起来
  6. * 在js中字符串可以使用单引号也可以使用双引号
  7. * 因为字符串可以看成是数组,所以,可以通过for循环进行遍历
  8. *
  9. * 字符串特性:不可变性,字符串的值是不能改变
  10. *
  11. * 字符串的值之所以看起来是改变的,那是因为指向改变了,并不是真的值改变了
  12. *
  13. *
  14. * */
  15. // var str="hello";
  16. // str[1]="W"; 字符串可以通过索引访问字符串中的某个值
  17. // 但是,是可以访问---读取---只读
  18. // 设置:就是可以改变
  19. //对象的方式来看待
  20. // var str="小苏好猥琐";
  21. // str="小苏好邪恶了";//重新赋值
  22. // console.log(str);
  23. // var str="hello";
  24. // str[1]="W";
  25. // console.log(str);
  26. // for(var i=0;i<str.length;i++){
  27. // console.log(str[i]);
  28. // }
  29. // var str="1";
  30. // str="2";
  31. // str="3";
  32. var str="123";
  33. str="456";
  34. console.log(str);
  35. //String对象
  36. // string ---->字符串类型----基本类型
  37. // String---->字
  38. //
  39. // 符串类型----引用类型
  40. //字符串对象----String对象
  41. // var str1="90";
  42. // var str2="哈哈,我又变帅了";
  43. // var str3="안녕하세요.";
  44. // var str4="こんにちは";
  45. // var str5="สวัสดี";
  46. // var str6="Привет ";
  47. var str="萨瓦迪卡";
  48. //js中没有字符类型
  49. //字符类型
  50. //字符串类型
  51. /*
  52. * 整数类型
  53. * int num=10;
  54. * 小数
  55. * float num2=90.4
  56. * 字符串
  57. * string str="hello"; //字符串必须用双引号
  58. * //字符
  59. * char ch='h'; //字符必须用单引号---值---只有一个
  60. *
  61. * char ch='y'
  62. *
  63. * 'h'+'e'+'l'+'l'+'o'---- "hello"
  64. *
  65. * //字符串是可以看成是多个字符组合成的数组的
  66. *
  67. * js中无论是单引号的还是双引号的都是字符串
  68. *
  69. *
  70. * */
  71. // var str="hello";//可以看成是一个字符数组
  72. // for(var i=0;i<str.length;i++){
  73. // console.log(str[i]);
  74. // }

String对象的方法

  1. /*
  2. *
  3. * 实例方法---->必须要通过new的方式创建的对象(实例对象)来调用的方法
  4. * 静态方法---->直接通过大写的构造函数的名字调用的方法(直接通过大写的对象名字调用的)
  5. *
  6. * */
  7. /*
  8. *
  9. * 字符串的常用属性:
  10. * .length------>字符串的长度
  11. * .charAt(索引),返回值是指定索引位置的字符串,超出索引,结果是空字符串
  12. * .fromCharCode(数字值,可以是多个参数),返回的是ASCII码对应的值
  13. * .concat(字符串1,字符串2,...);返回的是拼接之后的新的字符串
  14. * .indexOf(要找的字符串,从某个位置开始的索引);返回的是这个字符串的索引值,没找到则返回-1
  15. * .lastIndexOf(要找的字符串);从后向前找,但是索引仍然是从左向右的方式,找不到则返回-1
  16. * .replace("原来的字符串","新的字符串");用来替换字符串的
  17. * .slice(开始的索引,结束的索引); 从索引5的位置开始提取,到索引为10的前一个结束,没有10,并返回这个提取后的字符串
  18. * .split("要干掉的字符串",切割后留下的个数);切割字符串
  19. * .substr(开始的位置,个数);返回的是截取后的新的字符串
  20. * .substring(开始的索引,结束的索引),返回截取后的字符串,不包含结束的索引的字符串
  21. * .toLocaleLowerCase();转小写
  22. * .toLowerCase();转小写
  23. * .toLocaleUpperCase()转大写
  24. * .toUpperCase();转大写
  25. * .trim();干掉字符串两端的空格
  26. *
  27. */
  28. // .length------>字符串的长度
  29. var str = "12345";
  30. console.log(str.length);
  31. // .charAt(索引),返回值是指定索引位置的字符串,超出索引,结果是空字符串 通过下标
  32. // 字符串中第一个字符的下标是 0。如果参数 index 不在 0 与 string.length 之间,该方法将返回一个空字符串。
  33. results = str.charAt(0);
  34. console.log(results);
  35. // .fromCharCode(数字值,可以是多个参数),返回的是ASCII码对应的值
  36. results = String.fromCharCode(103);
  37. console.log(results);
  38. // .concat(字符串1,字符串2,...);返回的是拼接之后的新的字符串
  39. results = str.concat("上山打老虎");
  40. console.log(results);
  41. // .indexOf(要找的字符串,从某个位置开始的索引);返回的是这个字符串的索引值,没找到则返回-1
  42. index = str.indexOf("3", 0);
  43. console.log(index);
  44. // .lastIndexOf(要找的字符串);从后向前找,但是索引仍然是从左向右的方式,找不到则返回-1
  45. lastindex = str.lastIndexOf("5");
  46. console.log(lastindex);
  47. // .replace("原来的字符串","新的字符串");用来替换字符串的
  48. if (str.indexOf("12345") === !-1) {
  49. var replace = str.replace("12345", "54321");
  50. console.log(replace);
  51. } else {
  52. console.log("没有找到");
  53. }
  54. // .slice(开始的索引,结束的索引); 从索引5的位置开始提取,到索引为10的前一个结束,没有10,并返回这个提取后的字符串 也就是提取
  55. str = "这是一个要被提取的字符串";
  56. str = str.slice(5, 8);
  57. console.log(str);
  58. // .split("要干掉的字符串",切割后留下的个数);切割字符串
  59. str = "小明|小红|小军|小王";
  60. str = str.split("|");
  61. console.log(str);
  62. // .substr(开始的位置,个数);返回的是截取后的新的字符串
  63. str = "哈哈,小苏真的是好帅哦";
  64. str = str.substr(5, 5);
  65. console.log(str);
  66. // .substring(开始的索引,结束的索引),返回截取后的字符串,不包含结束的索引的字符串
  67. str = "哈哈,小苏真的是好帅哦";
  68. str = str.substring(5, 9);
  69. console.log(str);
  70. // .toLocaleLowerCase();转小写
  71. str = "HELLO";
  72. str = str.toLocaleLowerCase();
  73. console.log(str);
  74. // .toLowerCase();转小写
  75. str = "HELLO";
  76. str = str.toLowerCase();
  77. console.log(str);
  78. // .toLocaleUpperCase()转大写
  79. str = "hello";
  80. str = str.toLocaleUpperCase();
  81. console.log(str);
  82. // .toUpperCase();转大写
  83. str = "hello";
  84. str = str.toUpperCase();
  85. console.log(str);
  86. // .trim();干掉字符串两端的空格
  87. str = " 你好 ";
  88. str = str.trim();
  89. console.log(str);

js复习

01复习

  1. /*
  2. *
  3. * 复习:
  4. * JavaScript简称为JS
  5. * JavaScript是什么?
  6. * 是一门脚本语言:不需要编译,直接运行
  7. * 是一门解释性的语言:遇到一样代码就解释一行代码
  8. * C#语言是一门面向对象的语言,也是编译语言,是.net技术使用的
  9. * 是一门动态类型的语言---不解析
  10. * 是一门基于对象的语言---不解释
  11. * 是一门弱类型的语言,声明变量的时候都使用var
  12. * 强类型的语言:C#就是----->
  13. * 存储一个数字: int num=10; float num2=90.3;
  14. *
  15. * JS分三个部分:
  16. * 1. ECMAScript标准: js的基本的语法
  17. * 2. DOM
  18. * 3. BOM
  19. *
  20. * JS用了将近10天来发明的
  21. *
  22. * 变量---作用:操作数据(存储数据,读取数据)
  23. * 变量的声明:
  24. * var 变量名字;
  25. * var num;
  26. * 变量的初始化
  27. * var 变量名字=值;---->字面量的方式赋值
  28. * var str="您好啊";
  29. * js中大小写是区分的
  30. * js中的字符串可以使用单引号,也可以使用双引号---暂时推荐使用双引号
  31. * js中每行代码结束要有分号 ;
  32. * 数据类型:
  33. * js中的原始数据类型: number,string,boolean,undefined,null,object
  34. * null和undefined数据是没有太大意义的,null是很有意义的---对象的位置讲
  35. * NaN----不是一个数字,不是一个数字和一个数字计算--->结果就是NaN
  36. * isNaN()--->判断这个变量或者这个值是不是 不是一个数字---如果不是一个数字结果是true,如果是一个数字结果false
  37. *
  38. * number数据类型----无论是整数还是小数都是number数据类型的
  39. * string数据类型----字符串,获取字符串的长度:变量名.length
  40. * boolean数据类型---两个值,true,false
  41. * null----只有一个,null
  42. * undefined----只有一个,undefined,一个变量声明了,没有赋值
  43. * object---对象-----面向对象的时候讲解
  44. *
  45. * 类型转换:
  46. * 其他类型转数字
  47. * parseInt()---->转整数
  48. * parseFloat()--->转小数
  49. * Number()---->转数字-----要比上面两个严格
  50. * 其他类型转字符串
  51. * .toString()
  52. * String();
  53. *
  54. * 其他类型转布尔类型
  55. * Boolean()---->要么是true要么是false
  56. *
  57. * 运算符:----操作符
  58. * 算术运算符: + - * / %
  59. * 复合运算符: += -= *= /= %=
  60. * 赋值运算符: = 优先级别是最低的
  61. * 一元运算符: ++ --
  62. * 三元运算符: ? :
  63. * 关系运算符: > < >= <= == === != !==
  64. * 逻辑运算符: && || !
  65. *
  66. * 关系运算符的结果是布尔类型
  67. * 逻辑运算符的结果是布尔类型
  68. *
  69. * 表达式1&&表达式2
  70. * 如果有一个为false,整个结果就是false
  71. * 表达式1||表达式2
  72. * 只有有一个为true,整个结果为true
  73. * !表达式---结果就是取反
  74. *
  75. * 案例: 交换两个变量的值
  76. *
  77. *
  78. *
  79. *
  80. * */
  81. //如果有一个是字母字符串,另一个不是字符串是数字,用 - 或者* 结果是什么? 为什么要获取变量的数据类型? 为什么要有数据类型?
  82. // var ch="a";
  83. // var num=10;
  84. // console.log(ch*num);
  85. //
  86. // console.log(num);
  87. // //转布尔类型的时候是遵循1是true,0是false 的原则吗 ?
  88. // console.log(Boolean(1));//true
  89. // console.log(Boolean(0));//false
  90. // console.log(Boolean(11));//true
  91. // console.log(Boolean(-10));//true
  92. // console.log(Boolean("哈哈"));//true
  93. // console.log(Boolean(""));//false
  94. // console.log(Boolean(null));//false
  95. // console.log(Boolean(undefined));//false

02复习

  1. /*
  2. *
  3. * 一元运算符: ++ --
  4. *
  5. * 如果不参与运算, ++在前面还是在后面结果都是一样的 +1
  6. * 如果不参与运算, --在前面还是在后面结果都是一样的 -1
  7. *
  8. * var num=10;
  9. * num++; 后+
  10. * ++num; 前+
  11. * 无论是前+还是后+只要参与运算,结果可能就不太一样
  12. * 如:
  13. * var num=10;
  14. * var sum= num++ +10;
  15. * ++在后面的时候,先参与运算,然后自身加1
  16. * var num=10;
  17. * var sum=++num +10;
  18. * ++在前面的时候,先自身加1,然后再参与运算
  19. *
  20. * 流程控制: 代码的执行过程
  21. * 1. 顺序结构:代码的执行的顺序,从上到下,从左到右(不严谨)
  22. * 2. 分支结构: if,if-else ,if-esle if,switch-case ,三元表达式
  23. * 3. 循环结构:while 循环,do-while,for循环 for-in循环
  24. *
  25. * 总结分支:如果只有一个分支,就用if
  26. * 如果有两个分支,就用if-else
  27. * 如果多个分支,一般是范围的,推荐使用if-else if
  28. * 如果多个分支,一般是具体的值,推荐使用switch-case
  29. *
  30. *
  31. *
  32. *
  33. * 总结循环:
  34. * while:先判断后循环,有可能一次循环都不执行
  35. * do-while:至少执行一次循环体,再判断
  36. * for循环:知道了循环的次数,推荐使用for循环
  37. *
  38. *
  39. * 调试:是为了找代码的错误和问题所在,
  40. * 断点,不加断点,就不方便调试
  41. *
  42. *
  43. *
  44. * */

03复习

  1. /*
  2. *
  3. * break:在循环中遇到这个关键字,直接跳出当前所在的循环
  4. * continue:在循环中遇到这个关键字,直接进行下一次循环
  5. * 数组:存储一组有序的数据,数据类型可以不一样
  6. * 数组的作用:一次性存储多个数据
  7. * 数组元素:数组中存储的每个数据,叫数组元素,存储了5个数据,有5个数组元素
  8. * 数组的长度:数组的元素的个数,叫数组的长度:数组名.length--->就是长度,数组的长度是可以改变的
  9. * 索引(下标):存储数组元素的编号,从0开始,到数组的长度-1结束
  10. * 索引是用来存储和读取数组元素的
  11. * 遍历数组:通过循环的方式找到数组中的每个数据
  12. * 冒泡排序:
  13. * 求数组的和,最大值,最小值,平均值
  14. *
  15. * 数组定义的方式:
  16. * 1. 通过构造函数定义数组
  17. * var 数组名=new Array();空数组 Array()就是构造函数
  18. * var 数组名=new Array(长度);是设置数组的初始的长度,长度是可以改变的
  19. * var 数组名=new Array(值,值,值...);定义数组并设置数组中的元素值
  20. * 2. 字面量的方式定义数组
  21. * var 数组名=[];空数组
  22. * var 数组名=[10];这个数组有一个元素,值是10,长度是1
  23. * 数组变量
  24. * for(var i=0;i<数组名.length;i++){
  25. *
  26. * }
  27. *
  28. *
  29. * 函数:把一些重复的代码封装起来,在需要的时候直接调用这个函数就可以了
  30. * 函数作用:代码的重用
  31. * 函数定义:
  32. * function 函数名(){
  33. * 函数体
  34. * }
  35. * 函数调用:
  36. * 函数名();
  37. *
  38. * 参数:形参和实参
  39. * 形参:函数定义的时候函数名字后面的小括号里的变量就是参数,是不需要写var
  40. * 实参:函数调用的时候小括号里传入的变量或者是值,都是实参
  41. * 返回值:函数中如果有return,那么这个函数就有返回值
  42. * 如果函数中没有return,那么这个函数没有返回值
  43. * 如果函数中有return,但是后面什么内容都没有,这个函数没有明确返回值
  44. * 如果一个函数没有明确的返回值,函数调用了,并且接收了,那么此时接收的结果undefined
  45. * 如果直接输出函数名字,那么是这个函数的代码
  46. * 无参数无返回值的函数
  47. * function f1(){
  48. *
  49. * }
  50. * 有参数无返回值的函数,2个参数
  51. * function f2(x,y){
  52. *
  53. * }
  54. * 无参数有返回值的函数
  55. * function f3(){
  56. * return 100;
  57. * }
  58. * 有参数有返回值的函数
  59. * function f4(x){
  60. * return "您好";
  61. * }
  62. *
  63. *
  64. *
  65. *
  66. * */
  67. var arr = [1, 5, 10, 3, 100, 20];
  68. //循环控制比较的轮数
  69. for (var i = 0; i < arr.length - 1; i++) {
  70. //此时只是比较了一次---如果想要比较多次--for循环
  71. for (var j = 0; j < arr.length - 1 - i; j++) {
  72. if (arr[j] < arr[j + 1]) {
  73. var temp = arr[j];
  74. arr[j] = arr[j + 1];
  75. arr[j + 1] = temp;
  76. }
  77. }
  78. }
  79. console.log(arr);
  80. </script>
  81. <script>
  82. // //隐式全局变量
  83. // for( i=0;i<10;i++){
  84. // console.log("今天天气真好");
  85. // }
  86. </script>

04复习

  1. // var str = prompt("请输入一个数字");
  2. // //用户没有输入内容
  3. // if (str == "") {
  4. // console.log("您输入有误");
  5. // } else {
  6. // //用户输入内容了
  7. // if (!isNaN(parseInt(str))) {
  8. // console.log("用户输入的是一个数字");
  9. // //调用一个函数,把这个数字传入到函数中,判断该数字是不是质数
  10. // } else {
  11. // console.log("用户输入的不是一个数字");
  12. // }
  13. // }
  14. </script>
  15. <script>
  16. //如何判断一个数字是质数
  17. // var num=7;
  18. // function isPrimeNumber(num) {
  19. // for(var i=2;i<=num/2;i++){
  20. // if(num%i==0){
  21. // return false;
  22. // }
  23. // }
  24. // return true;
  25. // }
  26. // console.log(isPrimeNumber(num));
  27. </script>
  28. <script>
  29. /*
  30. *
  31. *
  32. *
  33. *
  34. *
  35. *
  36. *
  37. * */
  38. </script>
  39. <script>
  40. /*
  41. * 复习:
  42. * 函数:把一些重复的代码封装在一个地方,在需要的时候直接调用这个地方的代码就可以了
  43. *
  44. * 函数作用:代码重用
  45. *
  46. * 函数的参数:
  47. * 1.形参:函数定义的时候,函数名字后面的小括号里的变量
  48. * 2.实参:函数调用的时候,函数名字后面的小括号里的变量或者值
  49. *
  50. * 返回值:
  51. * 函数中有return,函数有返回值
  52. * 函数中没有return,函数没有返回值
  53. * 没有明确返回值:函数中没有return或者return后面没有任何内容
  54. * 如果一个函数没有明确的返回值,接收这个函数,结果是undefined
  55. *
  56. * 无参数无返回值的函数
  57. * 无参数有返回值的函数
  58. * 有参数无返回值的函数
  59. * 有参数有返回值的函数
  60. *
  61. * arguments----->可以获取函数调用的时候,传入的实参的个数
  62. * arguments是一个对象,是一个伪数组
  63. * arguments.length--->是实参的个数
  64. * arguments[索引]---->实参的值
  65. *
  66. * 作用域:变量的使用范围
  67. * 全局作用域:全局变量在任何位置都可以使用的范围
  68. * 局部作用域:局部变量只能在某个地方使用---函数内
  69. * 作用域链:在一个函数中使用一个变量,先在该函数中搜索这个变量,找到了则使用,找不到则继续向外面找这个变量,找到则使用,一直找到全局作用域,找不到则是undefined
  70. * 全局变量:只要是在函数外面声明的变量都可以看成或者是理解成是全局变量
  71. * 局部变量:在函数中定义的变量
  72. *
  73. * 预解析:在执行代码之前做的事情
  74. * 变量的声明和函数的声明被提前了,变量和函数的声明会提升到当前所在的作用域的最上面
  75. * 函数中的变量声明,会提升到该函数的作用域的最上面(里面)
  76. * 如果有多对的script标签都有相同名字的函数,预解析的时候是分段的,互不影响
  77. *
  78. *
  79. *
  80. *
  81. *
  82. *
  83. * */

05复习

  1. /*
  2. * 复习
  3. * 编程思想:
  4. * 面向过程:凡事亲力亲为,所有的事情的过程都要清楚,注重的是过程
  5. * 面向对象:提出需求,找到对象,对象解决这个问题,我们要结果,注重的是结果
  6. *
  7. * 面向对象的特性:封装,继承,多态,(抽象性)
  8. *
  9. * JS是一门什么样的语言?
  10. * 是一门解释性的语言
  11. * 是一门脚本语言
  12. * 是一门弱类型的语言
  13. * 是一门基于对象的语言
  14. * 是一门动态类型的语言
  15. *
  16. * 对象:有属性和方法,具体特指的某个事物
  17. * 对象:js中就是一组无序的属性的集合
  18. * 属性----特征
  19. * 方法----行为
  20. * 创建的对象的方式:
  21. * 1.通过调用系统的构造函数创建对象 new Object()
  22. * var obj1=new Object();
  23. * 2.自定义构造函数创建对象
  24. * var obj2=new 自定义构造函数();
  25. * 3.字面量的方式创建对象
  26. * var obj3={};
  27. * 变量 instanceof 对象------->布尔类型,判断这个变量是不是这个类型的
  28. *
  29. * JSON格式的数据,都是键值对,成对的数据
  30. * var obj={
  31. * name:"小明"
  32. * };
  33. * var json={
  34. * "name":"小明"
  35. * };
  36. *
  37. * json的数据实际上就是格式化后的一组字符串的数据
  38. *
  39. * 对象设置属性的值的写法
  40. * 对象.属性名字=值;----点语法
  41. * 对象["属性的名字"]=值;-----
  42. *
  43. * 对象获取属性的值的写法
  44. * 对象.属性
  45. * 对象["属性"]
  46. *
  47. * 遍历对象
  48. * for(var key in 对象){ key---是一个变量,这个变量中存储的是遍历的对象的属性的名字
  49. *
  50. * }
  51. *
  52. *
  53. * 原始数据类型:number,string,boolean,null,undefined,object
  54. * 基本类型(简单类型,值类型):number,string,boolean
  55. * 复杂类型(引用类型):object
  56. * 空类型:undefined,null
  57. *
  58. * 基本类型的值在栈上
  59. * 复杂类型的对象在堆上,地址(引用)在栈上
  60. *
  61. * 值类型之间传递的是值
  62. * 引用类型之间传递的是引用(地址)
  63. *
  64. *
  65. * 对象分三种:内置对象,自定义对象,浏览器对象
  66. * 内置对象:系统提供的
  67. * 自定义对象:自己写的
  68. * 浏览器对象:浏览器的
  69. *
  70. * Math 是一个对象,但是不是一个函数
  71. * Math对象下的属性和方法都是静态
  72. *
  73. * 方法:
  74. * Math.ceil()---向上取整
  75. * Math.floor()---向下取整
  76. * Math.Pi----圆周率的值
  77. * Math.Max()---一组数字中的最大值
  78. * Math.Min()---一组数字中的最小值
  79. * Math.abs()----绝对值
  80. * Math.random---随机数字
  81. * Math.sqrt()----开平方
  82. * Math.pow()----一个数字的多少次幂
  83. *
  84. *
  85. *
  86. *
  87. * new 的执行过程:----->new的时候,系统做了什么事?
  88. * 1. 开辟空间,存储创建的新的对象
  89. * 2. 把this设置为当前的对象
  90. * 3. 设置属性和方法的值
  91. * 4. 返回当前的新的对象
  92. *
  93. *
  94. *
  95. *
  96. *
  97. *
  98. *
  99. *
  100. *
  101. *
  102. *
  103. *
  104. *
  105. *
  106. *
  107. *
  108. *
  109. * */
  110. //
  111. // var obj={
  112. // name:"牙擦苏",
  113. // age:20,
  114. // sex:"男",
  115. // height:198,
  116. // weight:55
  117. // };
  118. // var objs={
  119. // "name":"值"
  120. // };
  121. // //遍历对象
  122. // for(var key in obj){
  123. // console.log(key+"======>"+obj[key]);
  124. // }
  125. var obj = {
  126. "name": "牙擦苏",
  127. "age": 20,
  128. "sex": "男",
  129. "height": 198,
  130. "weight": 55
  131. };
  132. var objs = {
  133. "name": "值"
  134. };
  135. //遍历对象
  136. for (var key in obj) {
  137. console.log(key + "======>" + obj[key]);
  138. }

总结数组知识

  1. /*
  2. *
  3. * 数组:存储一组有序的数据
  4. * 数组的作用:一次性存储多个数据
  5. * 数组的定义方式:
  6. * 1.构造函数定义数组: var 数组名=new Array();
  7. * 2.字面量方式定义数组: var 数组名=[];
  8. *
  9. * var 数组名=new Array();空数组
  10. * var 数组名=new Array(值);数组定义了,有长度
  11. * var 数组名=new Array(值1,值2,值3....);定义数组并且有多个数据
  12. * var 数组名=[];空数组
  13. * var 数组名=[值1,值2,值3];有三个数据
  14. * 数组元素:就是数组中存储的数据
  15. * 数组长度:就是数组中元素的个数
  16. * 数组索引(下标):从0开始,到数组的长度减1结束
  17. * 通过下标设置数组的元素值: 数组名[索引]=值
  18. * 通过下标访问数组的元素值: 数组名[索引]
  19. *
  20. *
  21. *
  22. *
  23. * */
  24. var arr1=new Array();//空数组
  25. var arr2=new Array(5);//长度为5的数组,每个数据的值是undefined
  26. var arr3=new Array(1,2,3,4,5);//长度为5分数组,
  27. var arr4=[];//空数组
  28. var arr5=[1,2,3];//长度为3的数组
  29. var arr6=["red","blue","green",1,true];//数组中元素的值的类型可以不一样
  30. var arr7=[];
  31. //设置数组的元素的值
  32. arr7[0]=10;
  33. arr7[1]=20;

总结分支语句

  1. /*
  2. *
  3. * 分支语句:
  4. * if语句:一个分支
  5. * if-else语句:两个分支,最终只执行一个分支
  6. * if-else if-else if...语句: 多个分支,也是只会执行一个
  7. * switch-case语句:多分支语句,最终也会一个(必须要有break)
  8. * 三元表达式:和if-else语句是一样的
  9. * 什么时候使用if-else if...: 一般是对范围的判断
  10. * 什么时候使用switch-case语句:一般是对具体的值的判断
  11. * 如果有多个分支,是针对范围的判断一般选择if-else if的语句
  12. * 如果有多个分支,是针对具体的值判断,一般选择用switch-case语句
  13. *
  14. *
  15. *
  16. *
  17. * */

简单类型和复杂类型

  1. //原始数据类型: number,string,boolean,undefined, null,object
  2. //基本类型(简单类型),值类型: number,string,boolean
  3. //复杂类型(引用类型):object
  4. //空类型:undefined,null
  5. //值类型的值在哪一块空间中存储? 栈中存储
  6. //引用类型的值在哪一块空间中存储?对象在堆上存储,地址在栈上存储
  7. //var num=10;//值类型,值在栈上
  8. //var obj={};//复杂类型,对象在堆,地址(引用)在栈
  9. //值类型之间传递,传递的是值
  10. //引用类型之间传递,传递的是地址(引用)
  11. //值类型作为函数的参数,传递的是值
  12. //引用类型作为函数的参数,传递的是地址
  13. // var num=10;
  14. // var num2=num;//传递的值
  15. // function f1(x) {
  16. // x=100;
  17. // }
  18. // var num=10;
  19. // f1(num);
  20. // console.log(num);//
  21. var obj={
  22. name:"小明"
  23. };
  24. function f2(obj2) {
  25. obj2.name="小红";
  26. }
  27. console.log(obj.name);//
  28. f2(obj);
  29. console.log(obj.name);//

总结while循环和do-while循环

  1. /*
  2. *
  3. * while循环特点:先判断,后循环,有可能一次循环体都不执行
  4. *
  5. * do-while循环特点:先循环,后判断,至少执行一次循环体
  6. *
  7. *
  8. * for循环:
  9. *
  10. * 总结
  11. *
  12. *
  13. * */

调试

  1. //调试:调试代码---高级程序员都是从调试开始的
  2. //调试:写代码---打开浏览器--F12(开发人员工具)--->Sources---双击文件,在某一行代码前面点击一下(出现的东西就是断点)
  3. var sum=0;
  4. for(var i=0;i<5;i++){
  5. sum+=i;//观察一下这个变量的值是多少,或者这行代码执行后的效果如何
  6. }
  7. console.log(sum);

json格式数据

  1. //对象:有属性和方法,特指的某个事物
  2. //对象:一组无序属性的集合的键值对,属性的值可以是任意的类型
  3. // function Dog(name) {
  4. // this.name=name;
  5. // }
  6. // function Person(name,age) {
  7. // this.age=age;
  8. // this.name=name;
  9. // this.sex=true;
  10. // this.dog={};
  11. // this.play=function () {
  12. // console.log("喜欢玩游戏");
  13. // };
  14. // }
  15. //
  16. // var sex=false;//男
  17. // console.log(sex?"男":"女");
  18. //JSON格式的数据:一般都是成对的,是键值对,
  19. //json也是一个对象,数据都是成对的,一般json格式的数据无论是键还是值都是用双引号括起来的
  20. // var obj={
  21. // name:"小明"
  22. // };
  23. /*var json = {
  24. "name": "小明",
  25. "age": "10",
  26. "sex": "男"
  27. };*/
  28. //遍历对象,是不能通过for循环遍历,无序
  29. //key是一个变量,这个变量中存储的是该对象的所有的属性的名字
  30. /* for (var key in json) {
  31. console.log(key + "===========" + json[key]);
  32. }*/
  33. // var key="name";
  34. // console.log(json[key]);
  35. //可以通过for-in循环
  36. //
  37. // for(var key in json){
  38. // //console.log(key);//json对象中的属性的名字
  39. // console.log(json[key]);
  40. // }
  41. //对象中确实有这个属性对象.属性名字 或者对象[属性名字]
  42. //一个一个的遍历出来
  43. // var arr=[10,20,30];
  44. // for(var i=0;i<arr.length;i++){
  45. // console.log(arr[i]);
  46. // }
  47. //json数据练习
  48. var json= {
  49. "name": "小军",
  50. "sex": "男",
  51. "age": "16",
  52. "eat": function () {
  53. console.log("会吃饭");
  54. }
  55. };
  56. for(var i in json){
  57. console.log(i+"---------"+json[i]);
  58. }

js初学总结的更多相关文章

  1. Node.js初学

    Node.js 初学~ 其技术上最大的卖点是非阻塞的I/O和基于事件的异步处理机制. 后端没有什么深入研究,一直对其不是很了解. 透过一个例子看 非阻塞 与 通常的 阻塞 var text = rea ...

  2. node.js 初学(二)—— 搭建注册/登录服务器

    node.js 初学(二)—— 搭建注册/登录服务器 理论上来说,代码实现在理论和实际上是一样的.但实际上来说,他们不是 做一个最简单的用户注册登录功能 1.接口定义: 注册:/user?act=re ...

  3. node.js 初学(一)—— http fs 服务器/文件/post get

    node.js 初学 —— http fs 服务器/文件/post get 这个世界,从来不会给失败者颁奖! 了解 node.js (开源) node.js 是用来做后台开发的,但是现在大部分前端人员 ...

  4. JS初学之-选项卡(图片切换类)

    初学选项卡,主要问题卡在了索引值上面,花了较长的时间学习. 索引值其实很好理解,就是为每一个元素用JS的方法添加一个属性,即自定义属性. 在for循环里的函数里用i,会直接弹出这个数组的length, ...

  5. JS初学之-if else图片顺序及循环切换

    初学JS,代码还需多多改进,自学中... <!doctype html><html><head><meta charset="utf-8" ...

  6. node.js初学遇到的问题

    是用express安装一个网站基础架构时 express -t ejs microblog 但是出来的模板引擎是jade,通过修改js也修改模板引用npm install 等等修改了index.ejs ...

  7. JS初学之-效果没出来怎么办?-alert函数测试

    一般出了问题之后,有经验的高手一眼就可以看出来,但是对于我们初学者来说,利用alert函数不失为一个好方法. 这时我们要利用逐行测试的方法,在任意一句代码下加alert,如果可以弹出来就说明上面的没有 ...

  8. 使用express搭建第一个Web应用【Node.js初学】

    来源:http://jingyan.baidu.com/article/bad08e1ee501e009c8512106.html express是一个开源的node.js项目框架,初学者使用expr ...

  9. JS初学的一些易错的知识点

    1.  false ,0 , "" ,undefined , null  在Boolean 环境下当成 false: null  在数值环境下当成 0: undefined 在数值 ...

  10. js初学必知三重点

    这里列出了一些JS重要知识点(不全面,但自己感觉很重要).彻底理解并掌握这些知识点,对于每个想要深入学习JS的朋友应该都是必须的. 讲解还是以示例代码搭配注释的形式,这里做个小目录: JS代码预解析原 ...

随机推荐

  1. Unity之SDK接入(Unity与Android通信)

    首先介绍一点关于Android与unity通信的知识: 完成通信主要靠unity中的class.jar包(在unity的安装目录下). 在unity中调用android的方法: jo.call(&qu ...

  2. Java集合框架之TreeMap浅析

    Java集合框架之TreeMap浅析 一.TreeMap综述: TreeMap在Map中的结构如下:

  3. 前端开发-Web标准

    Web标准 1理解:结构 => html表现 => css行为 => js(dom + es) WEB标准(结构.表现.行为分离)有哪些优点呢? 易于维护:只需更改CSS文件,就可以 ...

  4. 分布式唯一ID生成算法-雪花算法

    在我们的工作中,数据库某些表的字段会用到唯一的,趋势递增的订单编号,我们将介绍两种方法,一种是传统的采用随机数生成的方式,另外一种是采用当前比较流行的“分布式唯一ID生成算法-雪花算法”来实现. 一. ...

  5. yzoj P2350 逃离洞穴 题解

    题意 跑两边spfa的水题,注意判断有人才取最大值 代码 #include<bits/stdc++.h> using namespace std; inline int read(){ i ...

  6. 【2】KNN:约会对象分类器

    前言 这是一个KNN算法的应用实例,参考<机器学习实战>中的datingTestSet2.txt的数据集. 可以通过对不同约会对象的特征进行分析然后自动得出以下三种结论: 不喜欢的 有点魅 ...

  7. Cookie与Seesion的作用

    1.什么是Cookie与Session? cookie:首次访问服务器,服务器返回cookie置浏览器,存到用户电脑.之后去访问同一服务器,浏览器会携带相应cookie判断是否是同一浏览器的访问,告知 ...

  8. 如何从 if-else 的参数校验中解放出来?

    背景 在开发中经常需要写一些字段校验的代码,比如非空,长度限制,邮箱格式验证等等,导致充满了if-else 的代码,不仅相当冗长,而且很让人抓狂. hibernate validator(官方文档)提 ...

  9. c语言文件的基本操作

    c语言对文件的操作主要分为:按字符操作,按行操作,按内存块操作 主要的函数: fopen(): FILE * fopen(_In_z_ const char * _Filename, _In_z_ c ...

  10. tarjan缩点(洛谷P387)

    此题解部分借鉴于九野的博客 题目分析 给定一个 \(n\) 个点 \(m\) 条边有向图,每个点有一个权值,求一条路径,使路径经过的点权值之和最大.你只需要求出这个权值和. 允许多次经过一条边或者一个 ...