本文详细介绍了JavaScript的基本概念，包括语言特性、数据类型、变量声明、作用域规则、常见内置对象的操作方法，以及如何在HTML中使用JavaScript进行事件处理。
JavaScript是脚本语言，解释型语言，无需编译就可以随时运行，可以跨平台，只要有一个支持JS的浏览器即可
动态语言 执行该行代码的时候才知道是什么类型
弱类型语言 声明变量只有var 大小写敏感
<script type="text/javascript">
//显示当前时间
var dt = new Date();
alert(dt.toLocaleTimeString());//显示时间
alert(new Date().toLocaleDateString());//显示日期 alert函数是弹出一个消息窗口
</script>导入javascript文件：
创建javascript文件，导入javascript代码，不用加<script></script>，使用的时候直接拖动到文件内部即可
JavaScript文件中也有事件，name主要是为了提交，id代表唯一标识：
<input type="button" name="btn" value="按钮" id="btn1" onclick="alert('示例')" /> //注册按钮点击事件事件可以用on导出去寻找
点击超链接显示时间但是不跳转页面：
<a href="#" onclick="alert(new Date().toLocaleTimeString());">显示时间</a> //#在html中叫做锚定 需要在其他a标签中的name赋值<a href="javascript:void(0)" onclick="alert(new Date().toLocaleTimeString());">显示时间2</a>//不会跳转 单击超链接事件可以放在javascript后面 void(0)代表无其他操作<a href="javascript:alert(new Date().toLocaleTimeString())">显示时间2</a> //同上javascript有6中数据类型：
boolean number string null object undefine 其中只有object是引用类型，其余的都是值类型
alert(typeof(变量))
<script type="text/javascript">
var n1=null;
alert(String(n1));
</script> //n1用typeof显示为object类型，此时表示它可以被回收了，不可以调用方法，string（）显示的为Null 只声明未赋值显示为Nan（not a number）一个变量是null或者undefined 该变量是不能用的null和undefined：
1.undefined是一个未知状态，声明了但是没有初始化的变量，为undefined 方法没有明确的返回值时，返回值是undefined
对未声明的变量应用typeof运算符的时候，显示为undefined
2.null表示尚未存在的对象，null是一个有特殊意义的值，可以为变量赋值，此时的变量的值为已知状态（不是undefined）(可以被释放)
undefined==null 都对应布尔类型的false
undefined===null不成立
在javascript中，什么类型都可以转化为布尔类型 0对应false，非零的数对应true 空字符串对应false，其余字符串对应true
判断javascript已声明的变量，参数是否可用的方法：
if (typeof (x) != 'undefined' && x!= null){
alert('可用');
}一个变量前面不加var，则可以看作是全局变量
<script type="text/javascript">
function f1() {
var i = 100;
var sum = 0;
if (i > 5) {
sum += i;
}
alert(i);
}
f1();
</script>javascript中没有块级作用域
默认如果直接在script标签中定义变量，则属于“全局作用域范围”，即属于windows对象（全局作用域范围的变量知道网页关闭或浏览器关闭时才释放资源，一个页面中的多个<script>标签中的变量可以互相访问）
<script type="text/javascript">
var m=100; //作用域在script标签中，没有var则为全局变量
</script>如果在某个函数内定义了变量，则作用域范围属于该函数。
字符串只能\\转移，不能使用@
switch判断时，是全等
alert(parseInt(n)); //转换成intalert(parseInt(n，16)); //n是16进制的数,转换成10进制 var n='19hahah';
alert(parseInt(n)); //显示的是19，截取掉后面的部分，如果是'19.87'，显示的也是19var n = '90.123';
alert(parseFloat(n)); //显示的是90.89var n = '90.123';
alert(Number(n)); //转换成数字类型，显示的是90.123，如果是'78dsd'，则会返回NaN,Number是严格执行var n = 'sds332';
if(isNaN(parseInt(n1)){ //判断是不是NaN
alert('果然');
}else{
alert('2');
}运行后，在网页中F12脚本调试，设置断点，启动调试，F5刷新即可
window.alert(window.n1);
function show() {
var n = 100;
alert(n);
}
alert(show); //直接打印出方法
function show() {
var n = 100;
alert(n);
}
var ff = show();
alert(ff); //该方法没有明确的返回值 undefinedjs中方法没有访问修饰符，没有返回值类型，参数列表中的参数不需要写类型，没有返回值就不需要写return。
js中的方法没有重载，后面的方法会把前面重名的方法干掉。
function f1() {
return 89;
}
var result = f1();
alert(result); //有返回值的方法一般在js中编写大括号都是直接跟在后面而不要另起一行。
function ff() {
var sum1 = 0;
for (var i = 0; i < arguments.length; i++) {
sum1 += arguments[i];
} return sum1; }
var sum = ff(1, 2, 3, 4, 5, 6, 7, 8, 9, 0);
alert(sum); //可变参数，不能用params匿名函数:
var ff=function(){
};
ff(); //调用这个方法
匿名函数赋值给一个变量，后面必须有分号，ff中保存的是这个方法
通常用匿名函数为按钮注册事件
<body>
<input type="button" name="name" value="显示内容" id="btn"/>
<script type="text/javascript">
<!--获取这个按钮 给按钮注册一个单击事件-->
document.getElementById("btn").onclick = function () {
alert('1');
};
</script>
</body> var m1 = new Function ("p1","p2","p3","return p1+p2+p3");
alert(m1(1, 2, 3));闭包：
外面的方法中定义了一个变量，在里面的方法中可以访问 var func=function(name) {
return function () {
alert(name);
}
}
var ff = func();
ff();没事不要写闭包，闭包可以模拟面向对象，闭包通过作用域链来实现的，从最里面，开始向外搜索
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
var str = '床 前 明 月 光';
alert(str.length);//长度
alert(str.charAt(3));//根据索引找对应位置的字符
alert(str.indexOf('光'));//查找对应的索引，没找到返回-1
alert(str.indexOf('光', 5));//从5的位置开始查找
alert(str.split(' ');//分割 返回来的是数组，在js中数组可以直接输出，以逗号分隔
alert(str.substr(0, 2));//从0的位置开始截取两个
alert(str.substring(0, 3));//从索引为0的地方开始截取，截取到索引为3的前面
alert(str.toLowerCase());//转小写
</script>
</head>
<body>
</body>
</html>js中的数组不是一般的数组，长度可变，结合了许多东西，是一个综合体：
<script type="text/javascript">
var arr = new Array();
arr[0] = 1;
arr[1] = '哈哈哈';
arr[2] = 'c'
for (var i = 0; i < arr.length; i++) {
alert(arr[i]);
}
</script> <script type="text/javascript">
var arr = [1, 2, 3, 4, 5, 6];//数组
//var arr1 = { 1,2,3,4,5}; 键值对
for (var i in arr) {//for in 遍历数组，var后面的这个i是索引
alert(arr[i]);
}
</script> <script type="text/javascript">
function Person() {
this.name = '小杨';
this.age = 18;
this.gender = '男';
}
var p1 = new Person();
for (var key in p1) {
alert(key +'==='+ p1[key]); //通过索引的方式遍历对象的属性
}
</script> <script type="text/javascript"> //数组也可以作为键值对
var arr = new Array();
arr['yzk'] = '椰子壳';
arr['zxh'] = '最小化';
arr['zjy'] = '直接用';
for (var key in arr) {
alert(arr[key]);
}
</script> var arr = { "yzk": "椰子壳", "zxh": "最小化"}; //这种方式也是键值对
var arr = [{ "yzk": "椰子壳", "zxh": "最小化" }, { "yzk1": "椰子壳1", "zxh1": "最小化1" }];
for (var i = 0; i < arr.length; i++) {
alert(arr[i].yzk)
}
var personalInfo = { "name": "周杰伦", "age": 20, "address": { "city": "beijing", "country": "China" } };
alert(personalInfo.name);
alert(personalInfo.address.city);<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
//页面加载完之后执行 不推荐使用这种方法 要是标签嵌套很多就很麻烦 不如直接使用document.getElementById('txt1').value='';
window.onload = function () {
alert(window.fm.txt1.value);
}
</script>
</head>
<body>
<form action="" method="post" id="fm">
<!--表单标签-->
<input type="text" name="name" value="哈哈" id="txt1" />
</form>
</body>
</html><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
onload = function () {
document.getElementById('btn').onclick = function () {
alert('推荐使用这种方法');
} }
</script>
</head>
<body>
<form action="" method="post" id="fm">
<!--表单标签-->
<input type="button" name="name" value="哈哈" id="btn" />
</form>
</body>
</html>
扫一扫
357
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
