JavaScript
个人总结,不足请原谅,如需完整总结或技术探讨请私信不胜感谢:)
组成
- ECMAScript标准----基本的语法和基本对象
- DOM:Document Object Model 文档对象类型
- BOM:Broswer Object Model 浏览器对象模型
编译
- 把代码转换成计算机所认知的二进制
- JS是一门脚本语言:不需要编译
- JS是一门弱类型语言,声明变量都用var
- JS是一门动态类型语言:认知当前的这个变量是什么类型
- JS是一门解释性语言
JavaScript最初目的
- 解决浏览器和服EvernoteEvernote务器之间交互的问题}
JavaScript现在的功能:
- 交互的问题
- 特效
- 游戏
- 服务器端的开发
- 移动开发
HTML:展示信息
CSS:美化页面
JavaScript:实现浏览器和服务器交互,有计算和验证的能力
JS点出来的东西未必能用,点不出来的东西或许可以用(需要理解---长期)对象
JS的注意问题
- 变量有大小写之分
- 弱类型语言,声明变量都用var
- 字符串用单引号或者双引号都可以(JS中的单引号或者双引号都表示字符串)推荐用双引号,(不得已用单引号----和HTML嵌套的时候)
- 每行代码结束用分号
JS中的注释
---对代码的解释,注释中的代码不执行
- 单行注释 //
- 多行注释 /*注释内容*/
- HTML中的注释 CSS中的注释和JS的多行注释一样
JS代码的书写位置
- script标签中书写,可以写在HTML页面的任何位置(一般写在head标签中,也在body中写)---script标签在页面中可以存在多对
- 内联方式,嵌入在HTML标签之中
- 内部引用,直接在页面的script标签中写JS代码
- 外部引用,JS代码放在一个Js文件中,然后引用
JS代码注释事项
- 如果script标签中代码出错,回影响该标签后的代码执行,但是不会影响后面其他的script标签中的内容
- 不要在引用外部的JS标签中写其他script代码
异步和同步
- 异步:多人做多个事
- 同步:一人有顺序的做多件事
- script两个属性:async defer 均为异步
- async的属性的值就是其本身:页面加载就开始下载目标文件,下载完毕后立刻执行
- defer的属性的值就是其本身:页面中的所有内容全部加载完毕后,下载完毕后才执行
- 一般HTML标签中如果属性和值就是自己,并且只有一个,那么值可以省略
示例
变量位置交换
第一种
var a=1;
var b=2;
var tem;
console.log("第一次打印：");
console.log(a);
console.log(b);
tem=a;
a=b;
b=tem;
console.log("第二次打印：");
console.log(a);
console.log(b);
第二种
var a=1;
var b=2;
console.log("第一次打印：");
console.log(a);
console.log(b);
a=a+b;
b=a-b;
a=a-b;
console.log("第二次打印：");
console.log(a);
console.log(b);
第三种
var a=1;
var b=2;
console.log("第一次打印：");
console.log(a);
console.log(b);
a=a^b;
b=a^b;
a=a^b;
console.log("第二次打印：");
console.log(a);
console.log(b);
变量的声明及数据类型
- 变量的命名:由字母
- 下划线或者$符号开头,中间包含字母\下划线或者$符号\或者数字,推荐变量最好不要以$符号---要学习jQuery,里面都是$开头
- 变量名要有意义,最好用单词
- 如果变量名是多个单词组合的,那么第一个单词的第一个字母小写,后面的单词的第一个字母要大写---驼峰命名法
- 变量声明可以一次性声明多个变量
JS中的原始数据类型
- Number,String,Undefined,Null,Object,Boolean
- null类型的值只有一个就是null
- undefined类型的值只有一个undefined---未定义
- boolean(bool)布尔类型---1,0或true,false或真,假
变量返回值
- undefined----未定义,如果一个函数没有明确的返回值,但接收结果了,其也是underfined
- 显示变量的类型
- typeof
- typeof 变量名
- typeof (变量名)
- typeof
- 如果要使用变量,最好先判断这个变量的类型是不是undefined或者这个变量的值是不是null
<!--判断是否为underined或null类型-->
var def;
if(typeof (def)=='undefined'||def==null){
console.log("变量没有意义,不能参与运算");
}else{
console.log("可以使用");
}
八进制,十六进制
var number=0xa;//十六进制
console.log(number);//是以十进制的方式输出
var num1=020;//八进制
console.log(num1);//以十进制显示
不要用小数验证小数
var num1=0.1;
var num2=0.2;
var sum=num1+num2;
console.log(sum);
最大值最小值
console.log(Number.MAX_VALUE);//最大值
console.log(Number.MIN_VALUE);//最小值
字符串
- string类型,可以用单引号也可以用双引号
- 特性:不可变
- +用在两个字符串中间叫拼接或者叫连接
- +一个字符串和一个数字也是拼接
- 如果是减号,那么字符串中是数字会进行运算
其它类型转布尔类型
console.log(Boolean(10));//true
console.log(Boolean(1));//true
console.log(Boolean(0));//false
console.log(Boolean("hello"));//true
console.log(Boolean(""));//空字符串false
console.log(Boolean(" "));//true
console.log(Boolean(undefined));//false
console.log(Boolean(null));//false
var obj=new Object();//创建对象
console.log(Boolean(obj));//true
// 当一个变量没有赋值
//当一个变量声明了没有初始化
数据类型转换
其他类型转数字类型
- Number(变量)
- parseInt(变量)
- parseFloat(变量)---遇见字母立刻停止，parseFloat能够把整数部分一起截取,转换成number首个字符必须为数字
- undefined和任何数运算结果都是NaN
- null可以当做0
// console.log(parseInt("23"));//23
// console.log(parseInt("23.5"));//23
// console.log(parseInt("23rf"));//23
// console.log(parseInt("fe23"));//NaN
// console.log(parseInt("23.8.9"));//23
// console.log(parseInt(true));//NaN
// console.log(parseInt(null));//NaN
// console.log( parseFloat("23"));//23
// console.log( parseFloat("23.5.6"));//23.5
// console.log( parseFloat("fd23.5"));//NaN
// console.log( parseFloat("23.9fdf"));//23.9
// console.log( parseFloat("000023"));//23 NaN
// console.log(Number("45"));
// console.log(Number("45.5"));
// console.log(Number("045"));//45
// console.log(Number("45f"));//NaN
// console.log(Number("f45"));//NaN
其他转字符串
转换成string（number/boolean/undefined/null）
- a)变量+""----原有变量不会改变
- b)变量2=String(变量1);
- c)变量.toString()---只能转换number和boolean
其他转布尔
转化成bool
◇string: false:"" | true: " ","abc",
◇number: false:0 | true:任何除0数字
◇undefined null都是false
1.Boolean(变量)---把变量转换成bool类型，原变量不变
2. !!变量---一个叹号为取反，两个叹号为原值，转换为bool类型
从页面获取信息
prompt() confirm() ：前者获取字符串，后者获取boolean
alert()无法获取值，也可以理解为获取的值为undefined
流程控制：
1.顺序结构
从上往下，从左到右。从内到外
2.选择结构
if
if语句
◇第一种：直接进行if判断
if () {
};
// 括号内为布尔类型值，如果为true,则执行大括号内内容
◇第二种：直接进行if判断，否则进行else
if () {
}
else{
}
三元运算：一定程度上可以替换if..else 执行程序太多的时候不能替代
◇//第三种：直接进行if判断，否则进入else if,再否则进入else。
//满足哪个条件则进去，否则进入最后一个
if () {
}
else if () {
}
.
.
.
else{
}
第四种，直接进行if判断，否则进入else if。不存在最后的else。满足条件则运行，不满足则不运行
// 案例
var bool=confirm("Y or N?")
if(bool){
alert("已退出")
}
else{
alert("已取消")
}
//当前判断一个变量是否等于一个boolean值时不用判断，直接书写
// 案例2
// 控制台输出偶数
//
/*var str=prompt("a number")
// 字符串转化为数字
var num=str*1
//判断
if (num<0 || parseInt(num)!=num) {
alert("不要小数和负数")
} else{
if(num%2===0){
alert(num)
}
else{
alert("不是偶数")
}
}*/
//案例3 比大小
var a=prompt("输入一个数")*1
var b=Math.floor(Math.random()*100)
if (a>b) {
alert("您赢了")
alert("usr:"+a+"AI:"+b)
} else if(a=b){
alert("平手")
alert("usr:"+a+"AI:"+b)
}else{
alert("输了")
alert("usr:"+a+"AI:"+b)
}
script----如果不写type，默认就是JavaScript
三种输出语句
◆第一种：
document.write("输出到文档中"); 识别标签。
document.write("<h1>识别标签</h1>h1>");
◇注意点：
1.document后面必须有.
2.write后面必须有括号
3.write后面必须有引号
◆第二种:
alert();弹窗：兼容性不好，比较突然，用户体验不好。
alert("hello world");---弹窗（功能：提示或者显示值）
confirm("hello world?")---弹窗可以点击确定或者取消。（功能：用户判断）
prompt("hello world")----弹窗可以输入内容。（功能：让用户输入内容，后台获取）
◆第三种：控制台输出
console.log("hello world");---控制台输出日志，开发人员用的比较多。
console.error("报错");---控制台输出错误，系统报错用。
console.warn("警告");---控制台输出警告，系统警告用。
◆以对象类型打印内容
console.log([]);---以字面表现形式打印。
console.dir([]);---以对象的形式打印出来。
02.书写位置
◆第一种：外链式---工作是常用
<script type="text/javascript" src="02书写位置.js"></script>
如果在外链式内部书写内容，里面的内容将不会显示。
◆第二种：内嵌式---学习时用
◆第三种：行内式---后台较多
需辅助div.
03.注释方法
◆1.单行注释---两个//
◆2.ctrl+shift+/-----/* */
◆3.方法注释；---不要求掌握；
变量※
◆1.概念：装着内容的符号。
1'任何变量都用var定义。
2'后面放一个空格之后，再放一个变量名。
3'=在编程语言中，是赋值的意思，不是等于的意思
var aaa = 111;
变量命名一定注意语义化；
驼峰命名规则：getElementById---第二个词开始首字母大写。
遵从规则：
1'变量命名必须以字母或者下标符号“_”或者“$”为开头。
2'变量命名长度不能超过255个字符。
3'变量名中不允许使用空格，首个字不能为数字。
4'不能使用脚本语言中保留的关键字及保留符号作为变量名。
5'变量名区分大小写。（javascript是区分大小写的语言）
6'汉语可以作为变量名。但是不建议使用。
变量的赋值方式：
var num1=111;
直接赋值；
var num2;
num2=222;
先定义后赋值。
数据类型※
◆1.简单数据类型
String---字符串
var str="odin";//结构：英文格式的双引号或单引号，可以放任何值
console.log(str);//字符串在谷歌当中console.log打印出的是黑色文字。
console.log(typeof(str));//typeof();检测变量的数据类型、
//其他字符串
var str="测试"
//总结：带有引号的是字符串。不带是变量。
//+在两个字符串中是链接，不是加法
Number---数字
数值类型(number)
//整数（不分正负）
//浮点数（不分正负）
//
//在谷歌当中console.log打印出的是蓝色文字。
Boolean---布尔
在谷歌当中console.log打印出的是紫色文字。
true false 区分大小写，不带引号
Undefined---未定义
在谷歌当中console.log打印出的是灰色文字。
总结：定义变量不赋值：undefined;不定义：报错
Null---空
和undefined类似，复杂类型；
object类型
NaN:不是数字 not a number
判断是否为数字
isNaN();符合不是数字。
运算符※
1.算数运算符（+ - ++ --）
a)一元运算符：
正负
var a=123
console.log(+a)
console.log(-a)
++、--：自增自减
用法1：++在前，先自增，后运算
用法2：++在后，先运算，后自增
2.逻辑运算符（+ - * / ）
连接两个值时
a)有一个时字符串就是链接
b)都是数字则运算
c)undefined和任何运算结果都是NaN
% 取余
三元运算符： 值1？ 值2：值3
和if语句类似
判断值1的boolean值，如果为true则值2，为false为值3
逻辑运算符
丨或运算：有一个为1则1
短路：一旦前面满足则后面不再运算
||则显示true
& 与运算
! 非运算
3.◆比较运算符
==是否相等（忽略类型） ===数据类型也要相等
都是boolean类型
4.◆赋值运算符
= += -+ *= /=
= 结果是一个逻辑，给某个变量赋值
+= -+ *= /=
在原有值得基础上，运算后赋值给这个变量
112
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
