1、变量和数据类型
<script type="text/javascript">
var shxt = 100;
alert(typeof(shxt));//number
shxt = 123.123;
alert(typeof(shxt));//number
shxt = "四海兴唐";
alert(typeof(shxt));//string
shxt = false;
alert(typeof(shxt));//boolean
var num = null;
alert(typeof(num));//object//会报错
var a;
alert(typeof(a));//undefined
var arr = new Array();
alert(typeof(arr));//object
var obj = new Object();
alert(typeof(obj));//object
</script>
2、研究哪些是false???
<script type="text/javascript">
//控制台输出
console.log("=========>研究false有哪些<=============");
var shxt = false;
console.log(!!shxt);
shxt="";
console.log(!!shxt);
shxt=0;
console.log(!!shxt);
var a;
console.log(!!a);
shxt = null;
console.log(!!shxt);
shxt = NaN;
console.log(!!shxt);
</script>
false
""
0
不赋值
null
NaN[not a number]
3、如何定义函数???
<script type="text/javascript">
function test01(){
console.log("定义式==有名函数")
}
var test01 = function(){
console.log("变量式==匿名函数")
}
</script>
4、有名函数:
<script type="text/javascript">
//调用方法
test01();
function test01(){
console.log("悟空")
}
test01();
function test01(){
console.log("八戒")
}
test01();
function test01(){
console.log("唐僧")
}
test01();
//上面会输出4遍唐僧
</script>
<script type="text/javascript">
//调用方法
test01();
function test01(){
console.log("悟空")
}
test01();
//会输出两遍悟空
</script>
<!--方法只在自己的范围内生效,并且在各自的范围内,后者覆盖前者。-->
5、匿名函数:
<script type="text/javascript">
//test01();
var test01 = function() {
console.log("悟空");
}
test01();
test01 = function() {
console.log("八戒");
}
test01();
test01 = function() {
console.log("唐僧");
}
test01();
//会输出
//悟空
//八戒
//唐僧
</script>
匿名函数,后者不会覆盖前者,并且是按顺序执行的,只有先有方法声明,才能有调用。
6、函数的形参
<script type="text/javascript">
function test01(a,b){
console.log("a,b");
return a+b;
}
function test01(a,b,c){
console.log(a+","+b+","+c);
return a+b+c;
}
function test01(){
//内置对象
console.log(arguments);
var sum=0;
for(var i=0;i<arguments.length;i++){
sum+=arguments[i];
}
return sum;
}
var result01 = test01(1,2);
var result02 = test01(1,2,3);
console.log(result01);
console.log(result02)
</script>
7、逻辑运算符“||”或者
<script type="text/javascript">
//||的运行情况是跟Java的一样,但是结果不一样
console.log(true||false);//true
var num1 = 1;
var num2 = 0;
console.log(num1||num2);//1
var shxt;
var str = "悟空";
console.log(shxt||str);//悟空
var shxt = null;
var str = "八戒";
console.log(shxt||num2||num1||str);//1
</script>
||的运行情况是跟Java的一样,但是结果不一样
8、比较运算符
<script type="text/javascript">
var shxt01 = "悟空";
var shxt02 = "悟空";
console.log(shxt01==shxt02);//true
var num01 = 123;
//如果你的值为纯数字组成的字符串,在使用==比较的时候默认情况下使用的是10进制转换
var str01 = "123";
console.log(num01==str01);//true
var num02 = 0123;
console.log(num02)//83
var str02 = "0123";
console.log(num02==str02);//false
//JavaScript当中有一个符号===叫做全等 typeof(A)==typeof(B)&&A==B
console.log(num01===str01);//false
// 还有一个 !== 不全等 typeof(A)!=typeof(B) || A!=B
</script>
如果你的值为纯数字组成的字符串,在使用==比较的时候默认情况下使用的是10进制转换。
JavaScript当中有一个符号===叫做全等: typeof(A)==typeof(B)&&A==B
还有一个 !== 不全等:typeof(A)!=typeof(B) || A!=B
9、“+”的不同含义
<body>
<input type="text" id="num01">
<input type="text" id="num02">
<button type="button" onclick="mytest()">计算</button>
<input type="text" id="result01" readonly="readonly" >
<textarea rows="" cols="" id="result02" ></textarea>
<span id="result03"><b>元素内容</b></span>
<script type="text/javascript">
// + Java中 +12 运算符加法 连接符 字符串+
function mytest(){
var value01 = document.getElementById("num01").value;//元素
var value02 = document.getElementById("num02")["value"];//元素
var result = parseInt(value01)+parseInt(value02);
document.getElementById("result01").value=result;
document.getElementById("result02").value=result;
console.log(document.getElementById("result03").innerHTML);
//<b>元素内容</b>
document.getElementById("result03").innerHTML=result;//innerHTML获取(HTML标签)或者设置元素内容
//JavaScript提供了全局的内置函数 parseInt(变量) parseFloat(变量)
//console.log(parseFloat(value01)+parseInt(value02));
//console.log(obj["type"]);
//console.log(obj.id);
//console.log(typeof(obj.value));
}
</script>
</body>
①获取标签的值:
var value01 = document.getElementById("num01").value;
或者
var value02 = document.getElementById("num02")["value"];
②
document.getElementById("result03").innerHTML;就可以获取到id为result03里面的元素了。
innerHTML获取(HTML标签)或者设置元素内容
10、数组的说明
<script type="text/javascript">
//2.推荐简写方式
var array01 = [123];
console.log(array01);
//可以存储如何的数据
var array01 = [123,"悟空",true,null,undefined,function(){
console.log("dddd");
}];
array01[5]();
//如何清空数组
array01.length=0;
console.log(array01);
var array02 = [100,200,300,400];
for(var i in array02){
console.log("获取索引值:"+i);
console.log(array02[i]);
}
var array03 = [];
array03["wukong"]="悟空";
array03["bajie"]="八戒";
array03["tangseng"]="唐僧";
console.log(array03.length)
for(var i=0;i<array03.length;i++){//不好使
console.log(i);
}
for(var key in array03){
console.log(key);
console.log(array03[key])
}
var array04=[100,200,300];
array04[10]=400;
array04.push(500);
array04.push("wukong");
array04.push(null);
array04.unshift("八戒");
console.log(array04)
</script>
11、对象说明
JavaScript当中没有类,但是有对象。
<script type="text/javascript">
//2.推荐的声明方式
var obj = {
"name":"悟空",//obj的第一个属性
age:100//obj的第二个属性
};
obj.school="吉林大学";//obj的第三个属性
obj["shxt"]="四海兴唐";//obj的第四个属性
function test01(){
console.log(this);
}
obj.info = test01;//可以理解将test01方法的返回值赋给info
test01();//输出Window
obj.info();//输出Object
</script>
12、变量方面的问题
<script type="text/javascript">
var name = "谢霆锋";
var obj = {
"name":"李健",
getName:function(){
console.log(this)
console.log(this.name);
}
};
var shxt = obj.getName;//这个只是将obj.getName借给Window用了用,然后输出的this也是Window自己的,name也是他自己的。
shxt();//谢霆锋 this==window
obj.getName();//李健 this==obj
</script>
我下面这段话很有意思:
var shxt = obj.getName;
这个只是将obj.getName借给了Window用了用,然后输出的this是Window自己的,name也是Window自己的。
就相当于做饭,去邻居借了个郭,菜和调料还是要用自己家的。