js_基本入门(一)

2019-02-07 本文已影响0人 mao77_

js_(一)

1 输出信息的几种方式

Alert()

在页面弹出一个对话框，早期JS调试使用。

alert("these is words");

Confirm()

在页面弹出一个对话框，常配合if判断使用。

confirm("these is words");

console.log()

将信息输入到控制台，用于js调试(比较多)。

console.log("newspaper");

prompt()

弹出对话框，用于接收用户输入的信息。

prompt("I am the king of the world");

document.write()

在页面输出消息,不仅可以输出信息，还能输出标签

document.write("forget<br/><strong>your</strong> name");

转义字符

\ "：转双引
\ '：转单引
\n：转换行
\r：转回车
Js注释

快捷键——ctrl+/
单行注释——//
多行注释——/　/

2. js的基本语法要求

严格的区分大小写
所有的符号都是英文的半角
每一行代码之后可以添加分号，也可以不添加。（建议添加）
关键字和保留字
- 标识符起名：
  1. 必须是数字字母和下划线和$；
  2. 不能数字开头
  3. 驼峰命名法：
    - 大驼：构造函数用大驼：AaaBbb
    - 小驼：变量名，普通的函数名，属性名:aaaBbb

3. 变量

用来在内存中存储各种计算机要处理的数据。

声明变量
- var a; //a是变量名
给变量赋值(可以赋任何类型的值)
- a = 7;
可以同时声明多个变量
- var a，b，c;

4. 变量的声明提前

只会声明提前，其他的任何语句都不会提前。

js中，同一个变量可以多次声明
声明提前的特性，得到的一个结果
<i style="color:red;">变量的使用，一般要先声明后使用</i>
全局变量
- 直接在script标签中声明的变量，在当前页面的任何地方都可以访问

5. 数据的类型

在JS中，变量没有类型，变量的值有类型

5.1 简单数据类型（基本数据类型）

Number类型
- 1, 2, 4, 1.1(float)
- NaN: not a number
- +infinity
- -infinity
- var a = 0b10; (二进制: 赋值前面加上0b);
- var a = 0o10; (八进制: 赋值前面加上0o);
- var a = 0x10; (十六进制: 赋值前面加上0x);
String类型
- 一些特殊的字符，需要用到转义。
- 换行：\n
- 制表符tab: \t
- 回车： \r
- /: \ /
- ': \ '
- ": \ "
Boolean类型（布尔类型）
- true | false
- 用在判断和循环语句中
- !!(双重否定，可以转换)===
Undefined
- 当一个变量声明过，但是没有赋值，则值为undefined
Null
- 如果一个变量，本来要指向一个对象，但是没有成功指向任何对象，那么一般用null表示，用来释放对象。

5.2 数据类型的转换

显示转换
- ++其他类型转数字++
  - Number(""): 使用转换函数
  - undefined = NaN（转换出来）
  - null = 0（转换出来）
  - 变量－*／一个数字（有非数字字符会出现NaN）
  - 例：var num1 = "11"-0;
  - var num2 = "11"*1;
  - var num = "11"/1;
- ++其他类型转字符串++
  - String()
  - 与空字符串“”相加/或加上“abc”
- ++其他类型转布尔++
  - 0， NaN, undefined, null, ""， false(以上转出都是false,其他都为true)
隐式转换
- a - "b"

6. 运算符

6.1 算数运算符

+-*/
%：取余，求余，取模
- 余数的符号和被除号一致（a/b: a为被除数）
JS里面的除法为真除法（3/2 == 1.5）
在Java里面（3/2 == 1)

6.2 赋值运算符

=
符合赋值运算符：
- +=/-=/……

6.3 自增自减运算符

++：
- 表达式
- a++: 这个表达式的值是a自增之前的值
- ++a: 这个表达式是a自增之后的值
--：
- a--: 自减之前的值
- --a: 自减之后的值

6.4 比较运算符

.<
.>
.<=
.>=
- 如果两边的类型一样，就比较它们的内容
  - 如果两边都是数字，就是数学上的比较
  - 如果都是字符串，比的是字母表中的顺序（前面的小于后面的）（"a"<"b"）
  - 如果都是布尔值，true大于false
- 如果两边类型不一样，则转成数字再比。
- 特殊情况：
  1. NaN和任何数据都不相等（包括NaN）
  2. null 和 0不相等
  3. null 和 undefined是相等的==
.==
.===
- 严格相等
- 先看类型，如果类型不同，就直接认为不等于
- 类型相同，再看内容，
.!==
- 严格不相等
.!=

6.5 逻辑运算符

！非
- 任何value都可以非，但是输出的结果一定是true或者false
&& 与
- 只要有一个是false，结果就是false
|| 或
- 只要有一个是true,结果就是true.
- 它们都有一种“短路”的效果
- ==JS中的逻辑运算符，任何值都可以参与运算，结果也可能是任何值==。
- 在JS中，任何的值都可以当成布尔值来运算
- ++false: "", NaN, undefined, null, 0, false.++
- ++true: 其他的都可以当成true来用++
- 如果第一个可以决定最终的结果，则值是第一个；
- 如果第一个不能决定最终的结果，则值是后面那个。
```
//如果用户没有输入任何值，或者点了取消，我们仍然可以得到默认的四位数
var num = +(prompt("请输入")) || 9999;
console.log(num);
```

6.6 三元运算符

需要三个数据参与运算；

++表达式1？表达式2：表达式3++

    var a = 1;
    var r = a++? a++: a--;
    console.log(r,a);
    //输出为2，3

    //让用户输入两个数字，输出这两个数字的最大值和最小值。
    var i = +prompt("value1");
    var j = +prompt("value2");

    console.log("最大值："+(i>j? i: j)+";","最小值："+(i<j? i: j));

一定要记得转类型。prompt出来的是字符串。

    var a = [];
    var b = [];
    console.log(a < b);//false
    console.log(a > b);//false
    console.log(a == b);//false
    console.log(a <= b);//true
    console.log(a >= b);//true

7. 语句

7.1 If 语句

    if(表达式){
        //代码
    }

比较两个数的最大值

    var num1 = 20;
    var num2 = 30;
    // if(num1>num2){
    //     max = num1;
    // }else {
    //     max = num2;
    // }
    // console.log("最大值是："+max);
    
    //修改版本
    var max = num1;
    if(max<num2){
        max = num2;
    }
    console.log("最大值是："+max);

比较三个数的最大值和最小值

    //a,b,c，求最大值和最小值
    var a = +prompt();
    var b = +prompt();
    var c = +prompt();
    var max;
    var min;
    
    // if(a > b){
    //     if(a > c){
    //         max = a;
    //     }else {
    //         max = c;
    //     }
    // }else {
    //     if(b > c){
    //         max = b;
    //     }else {
    //         max = c;
    //     }
    // }
    // if(a < b){
    //     if(a < c){
    //         min = a;
    //     }else {
    //         min = c;
    //     }
    // }else {
    //     if(b < c){
    //         min = b;
    //     }else {
    //         min = c;
    //     }
    // }
    
    if(a > b && a > c){
        max = a;
    }else if(b > c && b > a){
        max = b;
    }else {
        max = c;
    }
    if(a < b && a < c){
        min = a;
    }else if(b < c && b < a){
        min = b;
    }else {
        min = c;
    }
    console.log("最大值为：" + max);
    console.log("最小值为：" + min);

表示式可以是任意类型
可以只有if，没有else if 和else
但是不能只有else if 或者else
我们的if语句可以任意的嵌套

7.2 Switch语句

break 一般会跳出当前switch语句
表达式可以是任何的值，case也可以是任何的值
是用===来匹配的

    switch (month) {
        case "1":
        case "2":
        case "3":
            msg = "春暖花开";
            break;
        case "4":
        case "5":
        case "6":
            msg = "夏日炎炎";
            break;
    }
    
    //--------------------------
    // 精简版本（然而有bug。不要用。）
    switch (parseInt((month-1)/3)) {
    case 0:
        masg = "春暖花开";
        break;
    case 1:
        masg = "夏日炎炎";
        break;
        ...

    var score = prompt("请输入分数");
    var msg;
    switch (parseInt(score/10)){
        case 10:
            msg = "无敌！";
            break;
        case 9:
        case 8:
            msg = "很优秀啊同学。";
            break;
        case 7:
        case 6:
            msg = "及格啦不要怕~";
            break;
        default:
            msg = "明天记得来办公室一趟。";
            break;
    }
    confirm(msg);

7.3 for语句

```
for(表达式1； 表达式2； 表达式3){
    // 循环体
}

// 表达式1： 只执行一次，作用一般是用来初始化一个循环控制变量（一般叫i）
// 表达式2： 用来判断是否执行下一圈。（布尔值）
    //  true就继续执行循环体
    // false就结束循环
// 表达式3： 用来控制循环变量；
    // 循环体每执行一次，然后就会去执行表达式3；
```

确定质数

// 写法一（旗帜法）
var num = 335324253;
for(var i=2; i<num; i++){
    if(num%i == 0){
        break;
    }
}
if(i == num) {
    console.log(num+"是质数");
}else {
    console.log(num+"是合数");
}
// ------------------------

// 写法2 （旗帜法）
var num = 335324253;
var flag = true; // 旗帜：表示这个数是否为质数
for(var i=2; i<num; i++){
    if(num%i == 0){
        flag = false;
        break;
    }
}
if(flag == true && num != 1) {
    console.log(num+"是质数");
}else {
    console.log(num+"是合数");
}

三角

var row = 23;
for(var i=0; i<row; i++){
    // i=1, j=4
    for(var j=row-1-i; j>0; j--){
        document.write("<span></span>");
    }
    for(var j=0; j<2*i+1; j++){
        document.write("<span>#</span>");
    }
    document.write("<br>");
}

js_基本入门(一)

js_(一)

1 输出信息的几种方式

2. js的基本语法要求

3. 变量

4. 变量的声明提前

5. 数据的类型

5.1 简单数据类型（基本数据类型）

5.2 数据类型的转换

6. 运算符

6.1 算数运算符

6.2 赋值运算符

6.3 自增自减运算符

6.4 比较运算符

6.5 逻辑运算符

6.6 三元运算符

7. 语句

7.1 If 语句

7.2 Switch语句

7.3 for语句

7.4 while语句

7.5 do...while语句

猜你喜欢

热点阅读