JS基础笔记1

JS基础笔记1:

引入方式:

行内式:

<a href="javascript:alert('新年快乐~')">点我有惊喜呦~</a>

嵌入式:

<script>
    alert("生日快乐");
</script>

使用嵌入式,建议件script标签放在body标签后,即打开一个html文件先加载样式,在加载内容,最后加载js

外链式:

<script src="./demo01.js"></script>
/* src属性内填js文件路径*/

注释:

// 单行注释(CTRL+?)
/* 多行注释(alt+shift+a) */

弹窗:

//1. 弹窗(确定)
//window.alert("happy birthday!");
//alert("happy birthday!")

//2. 弹窗(确定、取消)
// window.confirm("123456");
// confirm("123456");

//3. 弹窗 (输入、确定、取消)
// window.prompt("shuru");
// prompt("shuru");

//4. 控制台输出
// console.log("123456789");

//5.网页中
// document.write("123456");
// document.write("<h1>这是标题部分</h1>");html标签可被识别。
// 在document.write中要显示多个内容,可以使用+进行拼接

//js的执行顺序:先加载样式(css),再显示内容(html),再加载功能(js)

常量:

字面量

    // alert(100);

    // 圆的半径 6.8
    // 计算圆的周长  周长 = 2πr
    // alert(2*3.14*6.8);

    // 计算圆的面积  面积 = πr²
    // alert(3.14*6.8*6.8);

    // document.write(2*3.14*6.8);

变量:

作用:存储数据

声明:var 变量名;let 变量名;

/* 
声明/定义变量格式:   var关键字  变量名;
var关键字:可重复定义变量,可以变量提升

声明/定义变量格式:   let关键字  变量名;
let关键字:不可重复定义变量,不能做变量提升
*/

    // 变量赋值方式
    // 1. 直接赋值
    // var num = 2000;
    // alert(num);

    // 2.先声明再赋值
    // var num;
    // num = 50;

    // 3.变量赋值变量
    // var num = 10;
    // console.log(num);
    // var age = num;
    // console.log(age);
	
	// 修改变量值,重新赋值


    // 同时声明多个变量
    /* var x = 10,
    y = 20,
    z = 30;*/

	//undefined 未定义(变量未声明或已声明但是未赋值)
// 全局变量(可以用在当前页面的任何地方)
// 局部变量(函数里定义的变量:在函数执行完后自动销毁)

命名规范:类似于java,常用小驼峰命名法。

数据类型:

基本数据类型:

字符串string
    /* 基本数据类型 */
    // 字符串string
    var str = "星期四";
    // typeof(变量)   
    // console.log(str);
    // console.log(typeof(str));
    console.log(str,typeof(str));
	// 字符串中的转义符:反斜杠\
数字类型number
    // 数字类型number
    var num = 10;
    console.log(num,typeof(num));
特殊的数字类型:

NaN 是一种特殊的数字(代表该值不是数字)

Infinity 正无穷(数值/0)

布尔类型boolean(true,false)
    // 布尔类型boolean(true,false)
    var bol = true;
    console.log(bol,typeof(bol));

    var bol = false;
    console.log(bol,typeof(bol));

    var bol = 20<10;
    console.log(bol,typeof(bol));
null类型:检测的数据类型是object
    // null类型:检测的数据类型是object
    var x = null;
    console.log(x,typeof(null));
undefined类型
    // undefined类型
    var y;
    console.log(y,typeof(y));

数据类型转换:

自动转换:

// 自动类型转换
// let oldData = "10" * 2;
// let oldData = "10" * "2";
// let oldData = false - 1;   //false是0 true是1
// let oldData = null - 1;
// let oldData = undefined + 1; //NaN是一种特殊的数字(代表该值不是数字)
// let oldData = false - true;
// let oldData = 200 / false; //Infinity
// console.log(oldData,typeof(oldData));

// var x = 123;
// x = "字符";
// x = true;
// console.log(typeof(x));

强制转换:

将其他类型转换成number类型
1. Number(value)     value代表要转换的值
2. parseInt(value)   将value值转换为number类型并取整
3. parseFloat(value) 将value值转换为number类型并返回小数   

  1. Number(value)
/* =====================Number(value)======================= */
    // 将string类型转换成number类型
    // let oldData = "123";
    // console.log(oldData,typeof(oldData)); //number
    // let newData = Number(oldData);
    // console.log(newData,typeof(newData));


    // 将boolean类型转换为number类型
    // let oldData = false; //true-->1   false-->0
    // console.log(oldData,typeof(oldData));
    // let newData = Number(oldData);
    // console.log(newData,typeof(newData));
  1. parseInt(value)
/* ===================parseInt(value)====================== */
    // let oldData = "3.14";
    // console.log(oldData,typeof(oldData));
    // let newData = parseInt(oldData);
    // console.log(newData,typeof(newData));

    // let oldData = false;
    // let newData = parseInt(oldData);
    // console.log(newData,typeof(newData)); //NaN


    // let oldData = 10/3;
    // console.log(oldData);
    // let newData = parseInt(oldData);
    // console.log(newData,typeof(newData));

  1. parseFloat(value)
    /* =================parseFloat(value)  ================= */
        // let oldData = "123.123";
        // let newData = parseFloat(oldData);
        // console.log(newData,typeof(newData));
    
        // let oldData = "123";
        // let newData = parseFloat(oldData);
        // console.log(newData,typeof(newData));//123
    
        // let oldData = "123.1hello";
        // console.log(oldData,typeof(oldData));
        // let newData = parseFloat(oldData);
        // console.log(newData,typeof(newData));//123.1
    
        let oldData = "hello123.1";
        console.log(oldData,typeof(oldData));
        let newData = parseFloat(oldData);
        console.log(newData,typeof(newData));//NaN  number
    
    将其他类型转换成string类型
        // let oldData = true;
        // let newData = String(oldData);
        // console.log(newData,typeof(newData));
    
        // let oldData = 123;
        // let newData = String(oldData);
        // console.log(newData,typeof(newData));
    
        // let oldData = 20/6;
        // let newData = String(oldData);
        // console.log(newData,typeof(newData));
    
        /* 连接运算符+ */
    
        // let x = "hello" + 2022; //字符串和数字
        // console.log(x,typeof(x));
    
        let x = 10 + 20 + "hello" + "world";
        console.log(x,typeof(x));
    
        let y = true + "18"; //字符串和布尔值
        console.log(y,typeof(y));
    
        let z = 10 + +"2022";
        // let z = 10 + 2022;
        onsole.log(z,typeof(z));
    
    将其他类型转换为布尔类型:
    /*  
    Boolean(value)   --->一般情况下转换的结果都为true
    特殊情况(结果为false):  "" 0  undefined null NaN false
    */
        // let oldData = 3.14;
        // let newData = Boolean(oldData);
        // console.log(newData,typeof(newData));//true
    
    
        // let oldData = "将字符串转换为布尔值";
        // let newData = Boolean(oldData);
        // console.log(newData,typeof(newData));//true
    
    
        // let oldData = "";
        // let newData = Boolean(oldData);
        // console.log(newData,typeof(newData));//false 
    
        // let oldData = 0;
        // let newData = Boolean(oldData);
        // console.log(newData,typeof(newData));//false 
    
        // let oldData = undefined;
        // let newData = Boolean(oldData);
        // console.log(newData,typeof(newData));//false 
    
    
        // let oldData = null;
        // let newData = Boolean(oldData);
        // console.log(newData,typeof(newData));//false 
    
    
        // let oldData = NaN;
        // let newData = Boolean(oldData);
        // console.log(newData,typeof(newData));//false 
    
    
        let oldData = false;
        let newData = Boolean(oldData);
        let changeData = !newData;
        // console.log(newData,typeof(newData));//false
        console.log(changeData);  //true
    

运算:

var x = 123;
var y = "123";
var z = 456;

// =单等 代表赋值    ==双等 比较值   ===全等 比较的是值和数据类型 
// !=不相等(==的取反:比较值)  !==不全等(===的取反:比较的值和数据类型)

算术:

    // 算术运算符 + - * / %
    var x = 20;
    y = 6;
    // z = x + y;
    // console.log(z);
    // console.log(x,y); //打印x和y两个变量

    // 加法运算
    // console.log(x + y);//对两个变量进行运算

    // 减法运算
    // console.log(x - y);

    // 乘法运算
    // console.log(x * y);

    // 除法运算
    // console.log(x / y);

    // 取模运算% (计算余数)
    console.log(x % y);

    /*  
    自增、自减运算符:在自身的基础上+1或-1
        ++x:先运算再赋值
        x++:先赋值再运算
        
        --x:先运算再赋值
        x--:先赋值再运算
    */
    /* var x = 10;
    console.log(++x); //11
    console.log(x++); //11
    // x = 12
    console.log(--x); //11
    // x = 11
    console.log(x--); //11
    // x = 10
    console.log(x++);//10
    // x = 11
    console.log(x);//11 */


   /*  
    var y = 10;
    ++y; //y=11
    console.log(y++);//11   
    // 运算后y=12   
    y++; //12   运算y=13
    console.log(--y);12 
    */


    /* var x = 10;
    var y = 20;
    // 11+20=31
    var z = ++x + y++;
    console.log(z);
    console.log(y); */


    var x = 10,y = 20;
    var z = ++x + y++;
    console.log(z); //31   x = 11  y = 20
    // y = 21   x = 11  z = 31
    z = z + x++ + ++x;
    // z = 31 + 11 + 13
    console.log(z); //55

逻辑运算:

    // &&短路与 两边都为真 结果为真
    // var z = false && false;
    // console.log(z);


    // var z = (10 > 5) && (20 < 10);
    // console.log(z);


    // ||短路或  其中一个为真,则为真

    // var z = false || true;
    // console.log(z);

    //  var z = (10 < 5) || (20 < 10);
    // console.log(z);

    // !取反
    // var z = !(10<5);
    // console.log(z);

三元运算:

    // 三元运算符
    20 < 10 ? console.log("20小于10"):console.log("20不小于10");

拼接运算:

    // 字符串拼接
    /* var str = "Hello";
    var st = "World";
    // var s = str + st;
    // console.log(s);
    console.log(str + st);
    console.log(str,st); */
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值