JS基础 day01
初体验
<script>
//1.在控制台输出内容,控制台的目标(前端调试,用完删除)
//2.编写完成代码后,利用vscode的一个live server插件
//2.1 liver server
// chinese
// paht 暂时装这3个插件
console.log("hi..你好!");
//2.页面上输出 ctrl+b 折叠左边的东西
document.write("<div style='color:red'>你好呀</div>");
//3.提示框 (不推荐使用)
alert("你好呀")
//二,js页面的简单渲染过程
//打开页面,页面的标签,和css进行解析
//在解析 html标签的过程中,如果遇到了js,将暂停html的渲染,
//执行js , js 的堵塞, js没有执行完,后面的html,css都不执行
// 核心原因:js是单线程 (杨过)
//正是因为js的堵塞,就推出了两个属性
//async 页面加载完后,立即执行js
//defer 页面加载完后,按顺序执行js
//都解决了js阻塞问题
script标签的细节
<script type="text/javascript">
//1.如果script里面有src,将不会执行script里的代码而是执行外部引入的代码
alert("1234")
//2.script标签的默认type是text/javascript可以不写,写就要写对
//3 注释
//3.1 单行注释 // 快捷键 ctrl+/
//3.2 多行注释 /XXX/ ctrl+shift+/
//4.可变的量 variable 可变的量
var myname = "刘德华"; //alt+shift+f 是格式化 把空格什么的都显示出来
console.log(myname)
//申明变量,必须使用var 关键字
var age;//没有赋值,它的默认值是undefined(重点)
console.log(age);
age = 20;//把20赋值给age,把右边的值赋值给左边
console.log(age);
//推荐写法, 申明变量并赋予初始值(重点)
var sex = "男";
//定义个人的信息
//var name
console.log(name);//是window对象上的一个默认值;不建议申明变量使用name,
console.log(address);
console.log(myname);
/* var myname="刘德华"
var age=42;
var address="中国"; */
//当申明多个变量,可以使用一个var
var myname = "刘德华", age = 44,address = "香港";
</script>
变量申明的细节
<script>
//变量申明的细节
//1.申明变量,必须使用var关键字
//2.申明变量,未赋值的默认初始值是undefined
//3.建议申明变量,并赋予初始值
//4.申明变量后的值,可以随时随意被修改(因为js属于弱类型语言)
var age=20;
console.log(age);
age="二十";//把数值改成了字符串(一串双引号或者单引号组成的)
console.log(age);
</script>
变量的命名规则
<script>
//变量命名规则(重点)
//1.只能是数字,字母,下划线_,$
//2.不能以数字开头
//3.不能用保留字,关键字
//4.严格区分大小写
//5.遵循驼峰命名法
//5.1小驼峰 首字母是小写
// 变量,实例对象
//5.2大驼峰 首字母是大写
// 类,构造函数
//6.语义化(见名思意)
//var 关键字
//SyntaxError 语法错误
//var myname="abc"
/* var var="abc123"//关键字不能被当做命名来使用.
console.log(var);
*/
//关键字和保留字有哪些 ? 要背下来,必须背 在课件ppt 的第14页
//二阶段课件 day01js基础 ppt第14页
//什么是程序? 是一组有序的指令(代码).
</script>
数据类型
<script>
//如何检测基本数据类型,使用typeof (重点)
//1.Number 数值类型
//它有一个特殊的值 NaN
//NaN 全称呼 not a number 是否不是一个数值 不是数值的为true
var n = "你好";
console.log(n * 100);//NaN 按理来说报错,但是为了让程序正常执行,就推出了一个特殊的值NaN
console.log(0 / 0);//NaN
//检测是否为一个 NaN 是数值则为false,不是数值则为true
console.log(isNaN(NaN));//true NaN 自己都不认识自己
console.log(NaN == NaN);//false NaN 自己都不认识自己 ,只要出现了NaN 那就是false
console.log(isNaN("你好"));//true
//用isNaN 来判断是否为一个数值,只要是false,就认为是数值
//infinity 无穷大
var b = 12 / 0;
console.log(b);
//number的最大值 (了解)
console.log(Number.MAX_VALUE);// number 最大值 1后面的308个0
console.log(Number.MIN_VALUE);// number 最小值
var money = 100;
console.log(money);
//写法1
var res = typeof money;
console.log(res);
//写法2
var res2 = typeof (money)
console.log(res2);
//number类型的转换 转数值
//string--数值
var str = "你好";
console.log(Number(str));//NaN 为了不报错就是NaN
console.log(parseInt(str));//NaN 为了不报错就是NaN parseInt是整型 1
console.log(parseFloat(str));//NaN 为了不报错就是NaN parseFloat是浮点类型 0.1
var str = ""
console.log(Number(str));//0 art+shift+下 就是复制粘贴本行代码到下一行
console.log(parseInt(str));//NaN
console.log(parseFloat(str));//NaN Number方法转空字符串为0 其余的为NaN
var str = "12.3"
console.log(Number(str));//12.3
console.log(parseInt(str));//12 不是四舍五入 是砍掉小数
console.log(parseFloat(str));//12.3
//boolean--数值
//true为1,false为0
var flag = true;
console.log(Number(flag));//1
console.log(parseInt(flag));//NaN
console.log(parseFloat(flag)); //NaN
//null,undefined--数值
var n = null;
console.log(Number(n));//0
console.log(parseInt(n));//NaN
console.log(parseFloat(n)); //NaN
var n = undefined;
console.log(Number(n));//NaN
console.log(parseInt(n));//NaN
console.log(parseFloat(n)); //NaN
//parseInt 和 parseFloat, 在字符串里能转换 但是必须数值开头,其他的场景建议用Number()来转换
//Number 空字符串和null都是0
console.log(Math.round(4.5));//四舍五入
var str = "100px";
console.log(parseInt(str));
//obj--数值
//2.字符串类型 string 由一组双引号或单引号组成的,就是字符串
var str = "我是刘德华,我属牛,今年100岁";
console.log(typeof str);//string
//3.Boolean 布尔类型(重点) 只有 真和假 true false
var flag = true;//真
console.log(flag);
console.log(typeof (flag));//boolean
// Boolean 类型的转换规则: (牢记)
// String: 非空字符串为true, 空字符串为false
// Number: 非0数值为true, 0或者NaN为false
// Object: 对象不为null则为true, null为false
// Undefined : undefined为false
var str = "儿童"
var res = Boolean(str);
console.log(res);//true
var str = " "//非空字符串 , 里面内容是空格
var res = Boolean(str);
console.log(res);//true
var str = ""//空字符串
var res = Boolean(str);
console.log(res);//false
var n = 100;
console.log(Boolean(n));//true
var n = 0;
console.log(Boolean(n));//false
var n = NaN;
console.log(Boolean(n));//false
var n = -20;
console.log(Boolean(n));//true
var str = "0";
console.log(Boolean(str));//true
var str = "0" - 0;//减法会产生转换 隐式转换?//"0"-->0 //0-0
console.log(Boolean(str));//false
//null和undefined 转换成布尔类型 始终是false
console.log(Boolean(null));//false
//4.undefined 未定义 ,申明变量未赋予初始值,默认是undefined
//undefined 是一个特殊的类型
//
//5.null 空地址
//null 也是一个特殊的类型,指向的是空地址
console.log(null == null);//trun 两个等号是否相等 是的
//注意 null 和undefined 是派生关系 前者派生后者
//6.object 对象类型
//
var obj = {}//创建了一个崭新空盒子
var obj = { myname: "刘德华" }
console.log(obj);
var obj = new Object()
obj.age = 100;
console.log(obj);
var num = 100;
console.log(typeof (num));//Number
console.log(typeof typeof (num));//字符串 String
</script>
小总机
//1.什么是js ?
//与网页进行交换的脚本语言
//2.js的组成部分?
// ECMASCRIPT (ECMA:欧洲计算机制造商协会) 定义语法规范,关键字,保留字,语法
//BOM(Browser Object Moder) 浏览器对象模型
//DOM(Docunment Object Model) 文档对象模型
//3.js的变量
//申明变量必须使用var关键字
//变量的默认值是undefined
//变量的值可以随意被修改(js是弱类型语言)
//申明多个变量,可以使用,隔开
//4.//变量命名规则(重点)
//只能是数字,字母,下划线_,$
//不能以数字开头
//不能用保留字,关键字
//严格区分大小写
//遵循驼峰命名法
// 小驼峰 首字母是小写
// 变量,实例对象
// 大驼峰 首字母是大写
// 类,构造函数
//6语义化(见名思意)
//5.js的数据类型
//js在ECMA5之前,只有6大数据类型
// 1.数值类型 (Number)
// 2.字符串类型(String)-一组双引号或单引号组成
// 3.布尔类型(Boolean) 它的值只有两个 true/false (真/假)
// 4.null 空地址
// 5.undefined 未定义类型
// 6.object类型
//把六大类型分成2类
//1.值类型 (Number,String,Boolean,undefined,null)
//2.引用类型 (object,Array,Function,Date,...)
//6.js的类型转化
//1Boolean类型:
// Boolean 类型的转换规则: (牢记)
// String: 非空字符串为true, 空字符串为false
// Number: 非0数值为true, 0或者NaN为false
// Object: 对象不为null则为true, null为false
// Undefined : undefined为false
