JavaScript Day01
1.什么是JavaScript
嵌套在网页中的程序段,是一种解释性语言,由浏览器进行解析,与java没有任何关系。
作用就是增加用户的交互性
2.JavaScript·的技术体系
三部分:ECMA,Bom,Dom
ECMA:浏览器对象模型
Bom:浏览器对象模型
DOM:文档对象模型
BOM也包括DOM
3.如何html中引入JavaScript·
在html中使用
4.JavaScript 输入和输出
输出:
alert·(‘’);//弹出框
comsole.log();//控制台输出
document.write();//网页中输出
输入:
prompt();//输入
eg:
var num=prompt(‘请输入你的姓名’);
输入信息,点击确定按钮,返回的都是字符串类型
如果点击取消按钮,返回的null;
5.变量
是内存中的一个容器,存储的值是变化的
语法:
var 变量名;
赋值:=号,右边的值,放入左边的容器中
eg:
var num = 5;或 var num;
num = 5;
变量的命名规则:
1.必须是字母,下划线或美元符号开头
2.区分大小写
3.不能是关键字
4.见名知义,变量名一般首字母是小写(规范)
规则:
1.匈牙利法,小驼峰,大驼峰
注:变量名就是标识符
6.数据类型
生活划分两大类型: 数值型 与非数值型
计算划分,两大类:原始数据与引用类型
原始数据类型:
number:数字
string:字符型
Boolean:true false
null:空 typelof返回的类型是object
undefined:未定义(申明变量。但是未赋值)
typeof 变量名:返回变量的数据类型
弱类型语言:根据值的类型,进行变化
注:1.变量可以重复
赋值,后面的值覆盖前面的值
2.除了字符串要加双引号或单引号外,其他的类型,都直接写
7.使用变量
直接使用变量名即可
var num,num2=7,name=“国信安”
console.log(num,num2,name);
8.注释
//单行注释
//多行注释
/
*/:文档注释
9.数据类型的转换
1.转换为布尔类型
Boolean(要转换的值)
eg
var str=“true”
var re=Boolean(str);
总结: 字符串转布尔,除了空字符串以外,全部都是true
数字转布尔,除了0以外,全部都是ture
null 和undefined,转布尔都是false
2.数值转换:把非数值转换为数值的方式
第一种
Number()
原理是:把要转换的数值当成一个整体进行转换
NaN :not a number
注:空字符,false,null转成数字都是0
true转成数字为1
undefined转成数字为NaN
字符串转成数字,当成一个在整体转换
NaN的typeof类型为number
parseInt()
原理:从左到右,一位位的转换,如果有一个转换失败了,就结构转换(不包含小数字)
parseFloat:结果为数字,包含小数点
原理:从左到右,一位位的转换,如果有一个转换失败了
3.转成字符串
String(要转换的值)
要转换的值.toString()
总结:toString();方法,直接数字不能使用,null,undefined,是不管是否为变量都不能使用
数字放到变量中,用变量名.toString。这个是可以使用的
10.运算符
算数运算符:+ - * / %(取模)
+:两边都是数字,进行加运算
任意一边是字符串,进行字符串连接
运算符一般会存在着隐式转换,这个要特别注意
关系运算符:> < >= <= != !== == ===
使用关系运算符的表达式,返回时的结果是boolean;
==:比较值相等
===:值与类型相等
赋值运算符:=
先计算=右边的表达式,右边的
逻辑运算符:&& | | !
条件运算符(三元运算符):(表达式)? 为真时的处理:为假时候的处理;
位运算(了解):
++ – 自增 自减
单条语句,没有区别
符合语句中,++前表示先进行+1,然后再使用
++在后表示先使用,再进行+1
+= -= /= %=
练习
1.用代码实现
变量a中存储的数字10,变量b中存储的数字是3
1)a除以b后,并取整,在页面输出得到的结果?
2)将a%b后得到的结果转换为字符串类型,在打印台输出得到的结果,并验证最终的结果数据类型是否为字符串
2.用代码实现
输入一数字作为秒数,在页面按小时,分钟,秒的格式输出( 如输入600,页面显示:0小时10分0秒 )
3.用三元运算符实现
1)小明和妈妈约定,期末考试如果语文数学成绩都是满分100,周末妈妈就带他去游乐园,否则就只有在家改错题
2)小明考了双百分,妈妈周末带小明去游乐园玩了一天,随后和小明约定,如果明年小明还能拿到双百分并且奥数
能够获得华杯赛前90名就带他去迪斯尼乐园,否则就只有后年再努力了
3.使用axure画流程图
1)在淘宝购买商品的整个流程图(注意:购买时如果未登录需要回到登录页面,如果账户和密码输入错误3次将被锁定无法登录)
2)输入1个同学的成绩,60-70为D,70-80为C ,80-90为B,90-100为A 不及格-60为E 最后输出这个同学到底是哪个分段(画流程图并代码实现)
3)输入三个数,找出最大数(画流程图并代码实现)
答案
// // 第一题
// var a=10;
// var b=3;
// var res=a/b;
// var res2=a%b;
// document.write(‘第一题的答案是:’+parseInt(res));
// console.log(res.toString());
// 第二题
// var num1=prompt(‘请输入数字’);
// var h1=parseInt(num1/3600);
// var x=num1%3600;
// var m1=parseInt(x/60);
// var s1=x%60;
// document.write(h1+‘时’+m1+‘分’+s1+‘秒’);
//
//
// // 第三题
// var chinese=prompt(‘请输入语文成绩’);
// var math=prompt(‘请输入数学成绩’);
// (chinese100&&math100)? console.log(‘游乐园’):console.log(‘改错题’);
//
// var chinese2=prompt(‘请输入语文成绩’);
// var math2=prompt(‘请输入数学成绩’);
// var om=prompt(‘请输入奥数名次’);
// (chinese2100&&math2100&&om<=90)? console.log(‘迪士尼乐园’):console.log(‘明年努力’);
// // 第四题(2)
// var score=prompt(‘请输入成绩’);
// if (score<60){
// console.log(‘不及格’);}
// else if(score<70){
// console.log(‘D’) ;
// }
// else if(score<80){
// console.log(‘C’);
// } else if(score<90){
// console.log(‘B’);
// } else {
// console.log(‘A’);
// }
// 第四题(3)
var a=prompt(‘第一个数’);
var b=prompt(‘第二个数’);
var c=prompt(‘第三个数’);
(a>=b&&a>=c)? console.log(a):a=c;
(a>=b)?console.log(a):console.log(b);