JavaScript学习笔记<1>

JavaScript学习
1,JavaScript初识(js)
用途:数据验证,将动态内容写到网页中(ajax)
可以对事件作出相应,读取html中的内容,检测浏览器版本,模拟动画
让网页更加生动活泼。
2,JavaScript语法特点
基于对象 和 事件驱动 的 松散型的 解释性 语言
面向对象开发、事件驱动、松散型 弱类型、解释型语言,由浏览器解释执行
ECMAscript(语法)
数据类型、运算符、流程控制、函数、面向对象
BOM(浏览器对象模型)
DOM(文档对象模型)
3,js代码的书写方式
嵌入式:写在head标签里,
<script type="text/javascript">
alert('学习');
</script>
引入外部js文件:创建js文件,在文件里直接写js代码,不需要写script标签
在html文件里引入js文件格式<script src="exm.js"></script>
如果script标签是用来引入js文件的,那么这个script标签中就不能写任何js代码
重定向:类比a标签来记,也可以写在form里
<a href="javascript:alert('123');">点击</a>
<form action="javascript:alert('123');">
<input type="submit">
</form>
4,js四种输出工具
alert();弹窗。内容会以文本的原格式输出
document.write();将内容输出到页面,会以html的语法解析里面的内容
prompt('提示文字','默认值');输入框
console.log();将内容输出到控制台
5,js注释及分号用法
注释 ctr+? /* .... */ // 三种注释方式
分号 分号表示一段功能体的结束 如果有换行可以不加分号 能加分号一定加分号
6,变量的多种创建方式
变量:可以存储数据的一个容器,可以存储和引用任何数据
变量的创建,一般以“var”关键字修饰
先声明,后赋值,变量调用
var xy; xy='asdf'; document.write(xy);
声明和赋值同时进行
var xy='asdf'; alter(xy);
同时创建多个变量,然后赋值
var xy wx xw;
xy='qwe'; wx='er'; xw='fg';
同时创建多个变量并且赋值、调用
var xy='qwe', wx='er',xw='fg'; document.write(url);
7,变量的命名规范
严格区分大小写、必须以字母或_或$开头,余下的部分可以是任意字母数字,或_或$(数字不可以开头)
不能用关键字或者是保留字命名,命名要有意义,驼峰命名法。
如果变量被重新声明但没有重新赋值,变量的值保持不变
如果变量重新声明并重新赋值,变量原来的值被覆盖
8,数据类型
检测变量的数据类型 格式
var xy;
//检测xy变量的数据类型
var type = typeof xy;
document.write(xy);
Undefined: 如果变量被声明,但是没有被赋值,那么就是Undefined类型
Null:什么都没有
字符串:所有被引号标记的数据都叫字符串,在js中单引号,双引号没有区别
数值类型:整型 浮点型
布尔值: 真true 假false (真假运算)
对象: object(class)
9,字符串拼接
将变量写在字符串中
将变量左右两边各切一刀,将变量左右两边变成完整的字符串
将变量和左右字符串用加号连接
var name = prompt('请输入你的姓名');
document.write('亲爱的用户'+name+'你好,欢迎登陆!');
10,算数运算符
算数运算符:+ - * / % ++ --
加号两边都是数字表示加法运算;两边有任何一边为字符串,为字符串连接
减法,乘法,除法,会进行自动类型转换
取余,取余数
如果++在变量后面,比较无私,先参与运算,本身再自增;如果++在前,比较自私,先自增,再参与运算。--道理相同
11,关系运算符(比较运算符)
结果为布尔值 真或假
==只判断内容,不管类型;===全等,既判断内容又判断类型
!=只判断内容,不管类型;!==既判断内容又判断类型
关系运算符会自动对两边的数据进行类型转换
会进行类型转换的运算符:==、> 、 < 、>= 、<= 、!=
不会进行类型转换的运算符:!== 、 ===
12,赋值运算符
等号= a=a+2 a+=2(+可以换成- * / %)
13,逻辑运算符
与and && 运算符两边只要有一个假的,运算结果就是假的,只有两边为真才是真
或or || 两边只要有一边为真,结果就为真
非not !取反 假变真 真变假
14,三元运算符
三元表达式:根据表达式的计算结果有条件的为变量赋值
(条件)?条件为真的时候返回的值:条件为假的时候返回的值
var age = prompt("请输入你的年龄");
var hd=(age>=18)?'成年人':'未成年小朋友';
document.write(hd);
15,if判断
选择结构(分支判断、条件判断) 根据给定的条件有选择的执行相应的流程结构
单路分支if{} 双路分支 if{} else {} 多路分支 if{} else if{} else if {} 嵌套分支if{if{}}
16,switch判断
switch如果判断成功,会执行对应的代码,而他后面的判断不再执行
case判断的时候,要求所对比的数据和待对比的值,内容和类型一样
对比不成功时,默认default
17,自定义运算效果
<script type="text/javascript">
var x = prompt('请输入第一个数字')*1; 注:乘1是因为在进行加法运算时,会默认两个字符串连接,所以转换成数值类型
var charset = prompt('请输入运算符 + - * /');
var y = prompt('请输入第二个数字')*1;
switch(charset){
case'+':
var result = x+y;
break;
case '-':
var result=x-y;
break;
case '*':
var result=x*y;
break;
case'/':
var result=x/y;
break;
default:
var result = '你输入的有误';
}
document.write(result);
</script>
18,for循环
当满足一定条件时,重复执行某项操作
for(定义计数器;成立条件;计数器变化){ 循环体代码 }
循环结构一定要有结尾,不能写死循环
19,双层for循环
里外循环的计数器变量不能重名
20,直角三角形效果
for(var i=0;i<5;i++) {
for(var j=0;j<=i;j++) {
document.write("心");
}
document.write("<br />");
}
外层循环控制输出几行,里层循环控制每行输出几个
21,九九乘法表的实现
for(var i=1;i<=9;i++){
for(var j=1;j<=i;j++){
document.write(j+"*"+i+"="+i*j+"&nbsp;&nbsp;&nbsp");
}
document.write("<br />");
}
22,自定义行数列数 隔行变色的表格
快捷键,创建三行四列的表格tr*3>td{学习}*4-----table键
在js文件里创建表格方式:在document.write()里加入表格
js的字符串不能换行
23,while循环
一般不指定具体的次数,要有结尾,否则就是死循环
先判断,后执行
var age=18;
while(age<=50){
document.write(age+"岁领10块钱<br />");
age ++;
}
24,do while循环 break和continue
先执行一次,后判断
continue:跳出本次循环体后续代码,直接进入下次循环判断
break:直接结束本次循环,整个while循环停掉
25,函数的创建
函数是将完成某一个特定功能的代码集合起来,可以重复使用的代码块。函数相当于一个工厂
用function声明函数
function 函数名([参数1],[参数2]...){
函数体
[return] //返回值
}
函数里面的代码,在被调用的时候才会执行
调用函数/运行函数/执行函数
函数名.(); //需要几个调用几个
字面量形式声明函数,使用var
26,带参数的函数
明确函数的功能;声明函数;分析需要的参数;构建函数功能流程。
创建函数时,没有实际参数值的是形参
调用函数时传入的 有实际值的函数时实参。
如果实参个数比形参多,多余的参数会被忽略
如果实参个数少于形参,没有被复制的形参,默认值为undefined
NaN : not a number
27,函数return返回值
越权函数:函数拥有本不应该属于它的权利。
一般来讲,函数的结果要用return返回回来,函数在执行中如果遇到return,表示函数结束,后续代码不会执行
28,变量的作用域
局部变量:在函数内部,用var声明的变量。两个条件缺一不可
全局变量:不是局部变量就一定是全局变量。
29,Number函数
转换为数值类型
var result = Number('123'); //将字符串123转换为数值123
如果是布尔值,false转为0,true转为1;如果是数字转换为本身,将无意义的后导0去掉;
如果是undefined转换为NaN;如果是空字符转换为0;
30,parseInt parseFloat函数
parseFloat();将数据转换为小数
如果字符串是一个有效的整数,他返回的是整数,不会返回浮点数
parseInt();将字符串转换为整形,提取出整数
第二个参数表示第一个参数的进制
var result = parseFloat(123,8); //将八进制的123转换为十进制的123
31,isNaN eval函数
isNaN(); 用来判断数据是否不能转成数字。不能返回真true ,能返回假false
var result = isNaN('123');
eval(); 用js语法解析字符串的内容
32,数组的创建
一种数据的形式, 数组里每一个数据都是独立的,每个数据可以是任意合法类型。
数组中下标从0开始,数组是数据存储方式,其数据对象类型是object。
数组可以先创建再复制。
通过构造函数创建数组
33,数组的遍历
数组有个属性length 数组名.length 可以往数组中添加元素
使用for循环,遍历数组元素。
34,二维数组的创建和遍历
大数组里面套小数组
遍历二维数组使用for循环
35,获得数组最大值
function max(arr){
var x = arr[0];
//循环数组
for (var i =0;i<arr.length;i++) {
if(arr[i]>x){ //如果arr[i]>x,就让x存储arr[i]的值
x=arr[i];
}
}
return x;
}
36,获得二维数组中长度最大的子数组序号
function max(arr){
var x = 0;//x用来存储长度最长的子数组序号
for (var i =0;i<arr.length;i++) {
if(arr[i].length>arr[x].length){
x=i;
}
}
return x;
}

原文地址:https://www.cnblogs.com/weixinyu98/p/9960225.html