学习JavaScript——Day1
经过两年的大学生涯探索，我发觉本人比较适合前端开发，于是乎准备用这个账号来记录我的学习心路历程and笔记。（记录的可能有点乱）
about JavaScript
因为java应用程序接收数据后，对格式是有要求的，而HTML和CSS只是实现了显示数据、收集数据和网页的好看，所以出现了JavaScript这个可以对数据进行封装的基于对象的一种事件驱动的脚本语言。
在进行系统的学习之前，我确立了初步学习js的目标：
1、js的代码域声明
2、js的基础语法
3、js的函数和数组
4、js的常用对象和方法
5、js的window对象
今日学习成果
js支持的数据类型：
数值型：整数、浮点数
字符串型：用'' 和""
布尔型：ture、false
空(null)值：用于定义不存在的引用
未定义(undefined)值：是一个保留字，表已声明却未赋值
复合数据类型：包括对象和数值两种
js的代码域声明
问题：
js代码在HTML网页中进行声明，由浏览器打开网页的时候解析运行，但是js的解释方法和HTML是不同的，如何让浏览器在运行网页中的代码时将js和HTML进行区分运行呢？
解决：
在HTML网页中独立的声明js的代码声明的区域，类似CSS
实现：
1、内部声明：
使用script标签来声明，理论上可以声明在HTML网页的任何位置
但是一般情况下声明在head标签中
2、外部引入：
在外部声明.js文件，在其中声明相关的js代码，然后在HTML中
引入js文件即可，效果和在内部声明相同。
<!--内部声明方式 -->
<script type="text/javascript">
alert("我是内部声明");
</script>
<!-- 外部引入 -->
<script src="js/2222.js" type="text/javascript" charset="utf-8"></script>
<script src="js/3333.js" type="text/javascript" charset="utf-8"></script>
其中，在浏览器拿到代码后，会先看script内部引用，再看body内的内容。执行时则现在script引用自上而下的执行，再执行body。但是值得注意的是，在级别上内部引用>body=外部引用。
（讲的有点乱，反正就大概这么个意思，可以自己实践对比就明白了）
js的变量学习
js特别凑活，活的不精致；对于js来说，很多东西能用就行了，还要啥自行车。
最典型的就是js变量是没有类型的，一个var走天下
数据类型也不像java分的那么细
问题：
js的目的是实现网页和用户之间进行互动，有了js之后可以让
网页对用户在网页中录入的数据进行简单的处理，比如网格校验，
而数据的处理需要先将要处理的数据在内存中存储，怎么存储呢？
解决：
使用变量
作用：
存储要处理的数据
内容：
1、变量的声明
// js变量是没有类型的，没有int什么的类型
var a1="hello mf world";
var a2='c';
var aa=123;
var bb=3.14;
var cc=true;
var dd=new Date;//object类型
// alert(a1);
2、数据的类型：numbber string boolean object
// 查看数据类型的方法： alert(typeof a1);
3、特殊的值
null–是个object类型
undefined——无类型
NaN–number类型，表示不是一个数值
var b=null;//object类型
var c;//这是个值，它的值是undefined
var d="a";
var e="123";
//alert(Number());//将字符串转成数值
4、类型的转换
Number(数据)：将数据转换为数值，如果数据转换失败，返回NaN
Boolean(数据)：0，null,undefined,""会被转换为false
// 除0以外的数值转为true，0为false
//alert(Number("123"));
//alert(Number("asdf"));//返回NaN
//0，null,undefined,""会被转换为false
var m=0;
var n=5;
var f;
var g="";//空字符串
var h="ekjb";
var i=null;
var j=new Date();
//alert(Boolean(m));//返回false
//alert(Boolean(n));//返回true
//alert(Boolean(f));//返回false
//alert(Boolean(g));//返回false
//alert(Boolean(h));//返回true
//alert(Boolean(i));//返回false
//alert(Boolean(j));//返回true
5、注意事项
·js准许变量名重复，但是会后续执行的会覆盖前面的
·js中的字符串可以是单引号‘’
·js中的代码结束后可以不添加分号；
据说写js的大佬就用了十天的时间。emmm一般有这种功底的人，基本都没有什么头发…
js的数据运算
算术运算：+、-、*、/、%
比较运算：>、>=、=、<、<=
逻辑运算：&&（与）、｜｜（或）、！（非）、&、｜
特殊：
= =运算:
如果= =比较的两端的数据类型是相同的，则直接比较内容，内容相同返回true，不同返回false。
如果= =比较的两端数据不同，会先使用Number()将两端数据转换为数值，然后在进行比较
===运算：
先比较类型，类型不同直接false，类型相同再比较内容，内容相同返回true，不同返回false
//声明变量数据
var a=12;
var b=13;
//算术运算
alert(a+b);
//比较运算
alert(a>b);
//逻辑元算
alert(a>b&&a<b);
//==和===运算
var m=1;
var m1="1";
var m2=true;
var m3="true";
alert(m==m1);//ture
alert(m==m2);//ture
alert(m==m3);//false
alert(m===m1);//false
js的逻辑结构和循环结构
1、js的逻辑结构:
\quad
作用: 判断数据的处理场景，根据判断结果来运行对应的代码完成数据处理
\quad
内容：
\quad
\quad
if单分支结构
\quad
\quad
if(){}else{}双分支结构
\quad
\quad
if(){}else if(){}…else{}多分支结构 //只能成立一个
\quad
\quad
switch选择机构
//单分支结构
var a=3;
if(a>2){
alert("ahhh,js好简单");
}
var b="abc";
if(b){alert("66666");}
//这里js做了一个隐形的Boolean()运算 if(Boolean(b)){alert("66666");}
//选择结构
//选择结构的比较值和选择的值必须类型和内容完全一致才会被选择，相当于进行===比较
var a="a"; //var a=1;
switch(a){
case "a": //case 1:
alert("选择结构学习");
break;
default:
break;
2、js的循环结构：
\quad
\quad
for循环
\quad
\quad
while循环
\quad
\quad
do{}whule()循环 //先执行一次循环体，然后再判断
//循环结构：（九九乘法表）
for(var i=1;i<=9;i++){
for(var j=1;j<=i;j++){
//alert(j+"*"+i+"="+(j*i)); //要alert45次，还不好看
document.write(j+"*"+i+"="+(j*i)+" "); //把文本直接写入网页
}
document.write("<br />"); //换行
}
js的数组学习
问题：
\quad
目前我们可以使用变量，运算符和逻辑结构在HTML网页中声明数据的处理代码了。但是目前数据都是直接使用变量来进行存储的，那么一旦涉及到大量数据的运算，就需要声明大量的变量来使用，而变量之间是相互独立的，无法将数据的整体关系存储出来.
\quad
比如：张三的个人信息。
解决：
使用数组
作用：
1、存储数据
2、将数据的整体关系存储出来
数组的使用：
1、数组的声明
\quad
var 变量名=new Array();
\quad
var 变量名=new Array(长度);
\quad
var 变量名=[];
//数组的声明
var arr=new Array();//声明一个空数组
var arr2=new Array(5);//声明一个指定长度的数组 — alert(arr2.length); 显示5
var arr3=[];//声明一个空数组，简化的写法
var arr4=[1,"a",true,new Date()]; //js的数组可以存储任意类型的数据
2、数组的存储和获取
\quad
数组名[角标]=值；//给指定的角标赋值
\quad
var 变量名=[角标]; //获取指定的角标的数据，如果角标不存在，返回undefined
//数组的存储和获取
//js的数组可以在创建的时候初始化村粗数据，也可以创建好后按照角标存储数据
var arr5=[];
arr5[0]="a";
arr5[1]="b";
arr5[20]="c"; //js数组长度是动态变化的
alert(arr5);
alert(arr5[0]); //直接按照角标获取数据即可
3、数组的length属性
\quad
var 变量名=数组名.length; //返回数组的长度
\quad
数字名.length=值; //给数组指定长度，如果是缩减，则删除后面的数据
//数组的length属性
alert(arr5.length);
arr5.length=3;
alert(arr5);
4、数组的遍历
//数组的遍历
for(var i=0;i<arr5.length;i++){
alert(arr5[i]);
}
for(var i in arr5){
alert(i); //它alert的i是角标 - 0，1
alert(arr[i]); //这alert的才是值
}
5、数组的常规操作
类似java里的Arrays工具类
在js用户指南 - 语言参考 - js对象 - Array对象 - 方法
//concat方法：将传入的内容合并当前数组中，并返回新数组
var a,b,c,d;
a=new Array(1,2,3);
b="JS";
c=[42,"Hello"];
d=a.concat(b,c);
alert(d); //返回数组[1,2,3,"JS",42,"Hello"]
//join方法：把数组里的值取出来，拼成一个大字符串，每个字符串之间由指定间隔符号连接
var a1=[1,2,3];
var b1=a.join("-");
alert(b1);
//pop方法：移除数组的最后一个数值
var c1=[1,2,3];
c1.pop();
alert(c1); //返回 1，2
var d1=c1.pop(); //d1=被删掉的那个数值
alert(d1); //返回 3
//用for循环将数组一直删除到没有值为止
var e1=[1,2,3];
for(let i=0;i<=e1.length;i++){
e1.pop();
alert(e1);
} //返回 1，2 1
//push方法：将制定的元素追加到数组的最后，并返回数组新的长度
var a=[1,2,3];
a.push("bb");
alert(a); //返回1，2，3，bb
var l=a.push("bb");
alert(l); //返回4，即数组长度
//sort方法：排序
//shift方法：删除数组第一个元素并返回该元素
//unshift方法：将指定元素插入数组的首位，并返回该数组
数组的特点：
\quad
1、数组的创建不需要指定长度
\quad
2、数组的长度是动态变化的，存储的数据多，长度自动增长，删除数据，长度自动所见
以上就是我今日的学习成果啦～
4779
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
