JavaScript基础
1.概述
概念: 客户端脚本语言(脚本语言:不需要编译,直接被浏览器解析执行)
作用:增强用户和html页面的交互过程,控制html元素,增强用户体验
2.基本语法
2.1内部js
<script>
alert('hello world');
</script>
2.1外部js
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="js1.js"></script>
<!--<script>
alert('hello world');
</script>-->
</head>
注意:
可以放任意位置 但是会受位置影响 在他前边的会先执行
script 可以定义多个
2.3注释
1.单行注释
//单行注释
2.多行注释
/* 多行*/
2.4数据类型
1.(原始)基本数据类型
a、number 整数、小数、NaN(not a number 一个不是数字的数字类型)
console.log(isNaN(12));//false
isNaN 判断是否为非数字 结果为false 说明不是非数字 即数字
可以验证用户输入的数据
b、string
①
alert('放,啦【积分是丰富\n的非暗示领导立刻拉多少;\n"阿萨德d"sF非空FE');
注意 转义字符 还有 外双内单 外单内双
②字符串拼接
字符串+任何类型=字符串
var as='abc de';
console.log((as.length));
var aw=as+123;
console.log(aw);
空格也算一个字符
console.log('10'+10);//1010
结果依然是字符串
c、boolean
d、null
e、undefined 未定义
2.引用数据类型
对象
2.3.1数据类型转换
1.把数字转为字符串
- toString( )
- String(变量)
- 拼接 变量+’ ’
2.转化为数字类型
paserInt( ) 注意:取整了
paserFloat( ) 浮点数
Number( )强转
运用算数运算 如 ’12‘ - 0 隐式转换 //12
2.4变量 *
一小块存储数据的内存空间
js不同于Java
Java是强类型语言 在开辟变量存储空间的同时,定义了空间将来存储的数据的数据类型,只能存储固定类型的数据
而JavaScript是弱类型。不定义数据类型 可以存放任意类型的数据
var a=10;
输出到页面
br换行
var a=1;
var b=1.2;
var c=NaN;
document.write(a+'<br>');
document.write(b+'<br>');
document.write(c);
var a1='abc';
document.write(a1);
var a01=true;
document.write(a01+'<br>');
var b1=null;
var b01=undefined;
document.write(b1+'<br>');
document.write(b01+'<br>');
显示检测到的数据类型
ocument.write(a+'---'+typeof(a)+'<br>');
document.write(b+'<br>');
document.write(c+'<br>');
var a1='abc';
document.write(a1+'---'+typeof(a1)+'<br>');
var a01=true;
document.write(a01+'---'+typeof(a01)+'<br>');
var b1=null;
var b01=undefined;
document.write(b1+'---'+typeof(b1)+'<br>');
document.write(b01+'---'+typeof(b01)+'<br>');
这个object正常 因为null相当于占位符
案例:
1.输入用户名并弹出显示用户名
var myname=prompt('请输入你的用户名');
alert(myname);
2.更新变量
var myname='smy';
console.log(myname);
此时myname为smy
myname='hhh';
console.log(myname);
此时为hhh
3.声明多个变量
用,
var age=18,
address='baoding';
特殊情况:
3.1只声明不赋值
var sex;
console.log(sex);//undefined
3.2不声明不赋值会报错
3.3不声明直接赋值
aa=10;
console.log(aa);//10
2.5运算符
同Java
1.一元运算符:只有一个运算数的运算符
如:++ – +(正号)
在js中,如果运算数不是运算符所要求的的类型,那么js引擎会自动的将运算数进行类型转换
其他类型转number:
string按照字面值转换,如果不是数字,则转为NaN
boolean转,true为1 false为0
var a=1;
var b= -a;
document.write(b+'<br>');
document.write(a);
var a=+'123';
var b=1+a;
document.write(b+'<br>');
document.write(a);
var a=+'abc';
var b=1+a;
document.write(b+'<br>');
document.write(a);
2.算数运算符
如:+ - * /等
3.赋值运算符
= += -= 。。。。
4.比较运算符
< > >= <= == ===(全等于)
类型相同的
不是数字,而是字符串的话,按照字典顺序比较,按位比较,直到得出大小位置
document.write('abc'>'acd'+'<br>')
//false
c比b大 d比c大
类型不同的。先进行类型转换,在比较
document.write(('123'>1)+'<br>')
true
5.逻辑运算符
&& || !
6.三元运算符
? :
2.6分支语句等
同Java
3.数组
一组数据的集合,存储在单个变量下
3.1创建数组
1.new
var 数组名=new Array();
2.利用数组字面量( [ ] )创建
var 数组名=[ 1,2,23];
4.函数
函数是封装了一段可以被重复执行调用的代码块
目的:让大量代码重复使用
*注意:在js中 如果实参的个数多于形参个数 会取到形参个数
如果小于, 因为形参看作是不用声明的变量 ,此时形参没有接受值 定义为undefined 数字+undefined=NaN
4.1return
return是把结果返回给调用者 且终止函数
只返回一个值,返回的结果是最后一个值;
可以通过数组 返回多个结果:
function g(num1,num2){
return [num1,num2];
}
console.log(g(1,2));
如果没有return 则返回undefined
4.2return,break,continue的区别
return:退出循环,返回值,同时结束当前函数体代码
break:结束当前循环体
continue:跳出本次循环,继续执行下次循环
4.3arguments
arguments是函数的一个内置对象,所有函数都内置了一个arguments对象,arguments对象中存储了传递的所有实参
4.3.1使用
function f() {
console.log(arguments);
}
f(1,2,3);
伪数组:
1.具有数组的length属性
2.按照索引方式进行存储
3.没有真正数组的一些方法 如pop() push()等
例:
function getMax() {
var max=arguments[0];
for (var i=1;i<arguments.length;i++){
if (arguments[i]>max){
max=arguments[i];
}
}
return max;
}
console.log(getMax(1,34,23,45));
4.4函数的声明
1.利用函数关键字自定义函数(命名函数
function f(){
}
2.函数表达式(匿名函数
var f=function(){
};
注意:函数表达式中的 f是变量名,不是函数名,里面存的是值,
而函数表达式中存的是函数
js内可以函数内定义函数
5.预解析*
1.js引擎运行js分为:预解析,代码执行
预解析 js引擎会把js里面所有的var 和function 提升到当前作用域的最前面
代码执行:从上往下
2.预解析分为:变量预解析(变量提升)和函数与解析(函数提升)
变量提升: 就是把所有的变量声明提升到当前作用域最前面 不提升赋值操作
console.log(num);//undefined
var num=10;
函数提升:就是把所有的函数声明提升到当前作用域最前面 不调用函数
f();
function f(){
console.log(22);
}//相当于先声明了把这整个函数提到前边去 之后在调用
案例:
var num=10;
f(); //undefined
function f() {
console.log(num);
var num=20;
}
相当于:
var nu