第一章javaScript基本使用

1.输入输出语句
a.输出语句
用于在浏览器中弹出警告

 alert("未满十八岁禁止访问");
用于在控制台中输入信息           

  console.log('111');
用于在网页中输出内容

  document.write("三月请对我好一点")
b.输入语句
在网页中弹出一个输入框             

prompt("请输入姓名")
在网页中弹出一个确认框

输入语句
 //在网页中弹出一个输入框
 
        //prompt("请输入姓名")


    //在网页中弹出一个确认框
 
        //confirm("你真的满十八了吗?")


2.JS代码的引入方式
  <!-- js行内写法 -->
 
    <!-- onclick点击事件 -->
 
    <button οnclick="window.alert('别点了,再点人就傻了')">请点我</button>
 
 
 
    <!-- 嵌入式 -->
 
    <script>window.alert("内部样式")</script>
 
 
 
    <!-- 外链式 -->
 
    <script src="./3-外链式.js"></script>

3.变量
1. 变量的声明与赋值  

声明变量

 
        var boy;
 
        var girl;
 
        console.log(boy);//undefined(未定义的)
 
        console.log(girl);
 为变量赋值 

        boy="jack";
 
        girl="lily";
 
        console.log(boy);//jack
 
        console.log(girl);//lily
 2.let声明变量
let是ES6新引入的关键字,用来代替var的关键字;

  ES6是指2015年推出的ECMAScript(语法)

<script>
 
        var boyfriend="魏大勋";
 
        var boyfriend="魏晨";
 
        var boyfriend="白敬亭";
 
        console.log(boyfriend);
 
 
 
 
        //let不允许在一个代码块里有变量和他取同一个名字,但是允许修改同一个变量值
 
        let girlfriend="蔡徐坤";
 
 
 
        girlfriend="马嘉祺";
 
        console.log(girlfriend);
 
 
 
        {let girlfriend="xxx"}
 
 
</script>

 3.const声明变量
 错误写法 

 
        const a=3.14
 
        a=3.15
 
        console.log(a)
 正确写法
        const a=3.14
 
        console.log(a);
 
        const b;
 
        const必须要在声明的时候就赋值
 

4.关于变量
a.变量的声明与赋值
 //[先声明后赋值]
 
 
        //声明变量
 
        var boy;
 
        var girl;
 
 
        console.log(boy);//undeginded(未定义的)
 
        console.log(girl);
 
 
        //为变量赋值
 
        boy="jack";
 
        girl="lily"
 
 
 
        console.log(boy);//jack
 
        console.log(girl);//lily
 
 
 
        //[声明的同时并赋值]
 
        var myage =18;
 
        var myheight=188;
 
 
 
        console.log(myage);
 
        console.log(myheight);

b.let声明变量
 let是ES6新引入的关键字,用来代替var关键字

(ES6指2015年推出的ECMAScript语法)

<script>
 
        var boyfriend="魏大勋";
 
        var boyfriend="魏晨";
 
        var boyfriend="白敬亭";
 
        console.log(boyfriend);
 
 
 
 
        //let不允许在一个代码块里有变量和他取同一个名字,但是允许修改同一个变量值
 
        let girlfriend="蔡徐坤";
 
 
 
        girlfriend="马嘉祺";
 
        console.log(girlfriend);
 
 
 
        {let girlfriend="xxx"}
 
 
</script>

c.const声明变量
 Tips: let和var声明的变量可以改变

            const声明的变量不可以改变,即常量

            const必须要在声明的时候就赋值

 
        //错误写法
 
        // const a=3;
 
        // a=5;
 
        // console.log(a);
 
 
        //正确写法
 
        const a=4
 
        console.log(a);
 
 
 
       

d.let,var,const声明变量的区别
        (1)初始化要求不同

        使用var和let声明变量时可以先不初始化,而使用const声明变量时必须初始化。

        (2)重复声明不同

        使用var和let声明的变量可以多次被修改,其值只与最近一次赋值一致,而使用const声明的变量,在整个运行过程中不能修改初值

        (3)对块级作用域的支持不同。

        (使用一对花括号括起来的代码称为一个代码块所谓块级作用域,就是指变量起作用的范围是当前代码块,离开当前代码块,变量就失效了。

        使用var声明的变量支持全局作用域,使用let和const声明的变量支持块级作用域。

5.关于数据类型
a.数据类型的分类
        简单数据类型存储在栈内存中

        复杂数据类型的内存存储在堆内存中,地址存储在栈内存中

b.基本数据类型
 //boolean-布尔型
 
        let flag1=true;
 
        let flag2=false;
 
 
 
        //True,Flase,TRUE,FALSE这些写法都是错的
 
 
 
        console.log(flag1);
 
 
 
        let flag3="true"
 
        console.log(flag3);
 
 
 
        //number-数字型
 
        let age=18;
 
        let date="0306";
 
        console.log(age);
 
        console.log(date);
 
 
 
        console.log(Number.MAX_VALUE);//最大值
 
        console.log(Number.MAX_VALUE*2);//infinity无穷大
 
 
 
        var a=3-"b";
 
        console.log(a);//NaN(Not a Number) NaN也属于数字类型(非数字)
 
 
 
        console.log(isNaN(a));//ture
 
        console.log(isNaN(111));//false
 
        console.log(isNaN("abc"));//ture
 
        console.log(isNaN(Infinity));//false
 
        console.log(isNaN("false"));//ture
 
 
 
        //string-字符串
 
        let demo1="字符串";
 
        let demo2='字符串';
 
        let demo3=`字符串`;
 
        let demo4="老师说'今天不上晚自习'"
 
 
 
        console.log("111\'222");
 
 
 
 
        //undefinded-未定义型
 
        //表示声明的变量还未赋值
 
        let grate;
 
        console.log(grate);//undefinded
 
 
 
 
        //null-空型
 
        var a=null;
 
        console.log(a);//null

c.数据类型检测
isNaN 检验是否是一个非数字

格式:typeof()

Tips:布尔类型ture,会在运算中转化为数字1

           布尔类型false。会在运算中转化为数字0

           加号遇上字符串,做拼接使用

 
        console.log(typeof("123"));//string
 
        console.log(typeof(false));//boolean
 
        console.log(typeof(NaN));//Number
 
        console.log(typeof(Infinity));//Number
 
        console.log(typeof("true"));//string
 
        console.log(typeof(null));//object
 
        console.log(typeof(undefined));//undefined
 
 
 
        console.log(typeof('aaa'*2));//Number
 
        console.log("aaa"*2);//NaN
 
 
 
        console.log(2-"true");//NaN
 
        console.log(typeof(2-"true"));//Number
 
 
        console.log(2-true);//1
 
        console.log(typeof(2-true));//Number
 
 
        console.log(2+"true");//2true
 
        console.log(typeof(2+"true"));//string
 
 
 
        console.log(2+true);//3
 
        console.log(typeof(2+true));//Number

     

d.数据类型的转化
   1. 格式: Boolean()

    Tips:将数据类型转换为布尔类型

               字符串类型和数字类型都会转化为布尔类型的true

               空字符串转为布尔类型的false,空字符串转为ture

               数字0转为布尔类型的false

    2. 将数据转化为字符串类型

     Tips:使用String()或toString进行转换

    3. 将数据转化为数字型

      Tips:Number()用于将数据转化为数字型数据
 

 
        //Boolean()
 
 
        var  a=Boolean("a");
 
        console.log(a);//true
 
 
        console.log(Boolean(123));//true
 
 
        console.log(Boolean(""));//false
 
 
        console.log(Boolean(" "));//true
 
 
        console.log(Boolean(0));//false
 
 
        console.log(Boolean(NaN));//false
 
 
        console.log(Boolean(undefined));//false
 
 
        console.log(Boolean(null));//false
 
 
 
        //将数据转化为字符串类型
 
        //使用String()或toString进行转换
 
        let num=123;
 
        console.log(num);//数字类型的1
 
        let num2=String(num);
 
        console.log(num2);//字符串类型的1
 
 
 
 
        //将数据转化为数字型
 
        //Number()用于将数据转化为数字型数据
 
        console.log(Number(123));//123
 
        console.log(Number("123"));//数字类型123
 
        console.log(Number(""));//0
 
        console.log(Number(" "));//0
 
        console.log(Number(null));//0
 
        console.log(Number(undefined));//NaN
 
        console.log(Number(false));//0
 
        console.log(Number(true));//1
 
        console.log(Number("true"));//NaN
 
        console.log(Number("123.1"));//123.1
 
        console.log(Number("123.a"));//123.a

6.流程控制
一.选择结构
a.if语句(单分支)
   格式:if(条件表达式){代码段}

<script>
let age=prompt("输入年龄")
        if (age>=18) {
            document.write("欢迎进入")
        }
</script>
b.if...else语句(双分支)
格式:if(条件表达式){代码段} else {代码段2}

<script>
 let age=prompt("输入年龄")
        if (age>=18) {
            document.write("欢迎进入")
        }else{
            document.write("不可进入")
        }
</script>
c.if..else if..else语句(多分支)
格式:if (条件表达式1) {

           结果1

        }else if (条件表达式2) {

            结果2

        }else if (条件表达式3) {

            结果3

        }else{

            除去123之后的结果

        }

 <script>
 let num=prompt("输入分数(0~100)不可乱写")
        if (num===100) {
            document.write("奖学金")
        }else if (num>=80&&num<=99) {
            document.write("成绩优秀")
        }else if (num>=60&&num<=80) {
            document.write("成绩合格")
        }else if (num>=40&&num<=60) {
            document.write("有补考机会")
        }else if (num>=20&&num<=40) {
            document.write("挂科")
        }else(
            document.write("留级")
        )
</script>

d.switch语句
   case--情况;  break--跳出语句
       switch (表达式) {
            case 值1:
            代码段
            break;
 
            case 值2:
            代码段
            break;
       
 
            case 值3:
            代码段
            break;
 
            ...
       
       
        default:
            代码段n
       }

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值