JavaScript
JavaScript
-
JS是一门事件驱动型的编程语言，依靠事件去驱动，然后执行对应的程序。
-
在JS中有很多事件，其中有一个事件叫做：鼠标单击，单词：click。并且任何事件都会对应一个事件句柄：onclick。
-
注意：事件和事件句柄的区别是：事件句柄是在事件单词前面添加一个on。
-
事件句柄是以HTML标签的属性存在的。
-
-
onclick="js代码"，执行原理：
-
页面打开的时候，js代码并不会执行，只是把这段js代码注册到按钮的click事件上了。等这个按钮发生click事件后，注册在onclick后面的js代码会被浏览器自动调用。
-
-
JS没有函数重载，当两个函数重名，后面的函数会覆盖前面的函数。
-
当一个变量申明的时候没有使用var关键字，那么不管这个变量是在哪里申明的，都是全局变量。
-
全局变量：
-
在函数体之外声明的变量属于全局变量
-
全局变量的生命周期：
-
浏览器打开时声明，浏览器关闭时销毁，尽量少用。因为全局变量会一直在浏览器的内存当中，耗费空间内存。
-
-
-
局部变量：
-
在函数体当中声明的变量，包括一个函数的形参都属于局部变量
-
局部变量的声明周期：
-
函数开始执行时局部变量的内存空间开辟，函数执行结束后，局部变量的内存空间释放。生命周期较短。
-
-
-
JS中有一个运算符叫做typeof，这个运算符可以在程序的运行阶段动态的获取变量的数据类型。
-
typeof运算符的语法格式：
-
typeof 变量名
-
-
typeof运算符的运算结果是以下6个字符串之一：（注意字符串都是小写）
-
"undefined"
-
"number"
-
"string"
-
"boolean"
-
"object"
-
"function"
-
-
-
在JS当中比较字符串是否相等使用“==”完成，没有equals。
function sum(a,b){ //规定a，b都为number类型 if(typeof a=="number" && typeof b=="number"){ return a + b; } alert(a + "," + b + "必须都为数字") } -
注意：null属于Null类型，但是typeof运算符的结果是“object”
-
Undefined类型只有一个值，就是 undefined
-
当一个变量没有手动赋值，系统默认赋值undefined，或者也可以手动赋值undefined。
-
-
关于NaN（表示Not a Number，不是一个数字，但属于Number类型）
-
当运算结果本来应该是一个数字，最后算完不是一个数字的时候，结果是NaN。
-
-
当除数为0时，结果无穷大：Infinity
-
关于isNaN函数：
-
用法：isNaN（数据），结果是true表示不是一个数字，结果是false表示是一个数字。(is Not a Number)
-
function sum(a,b){ if(isNaN(a) || isNaN(b)){ alert("参与运算的必须是数字") return; } return a + b; }
-
-
parseInt(); 可以将字符串自动转换成数字，并且取整数位。
-
parseFloat(); 可以将字符串转换成数字 --> alert(parseFloat("3.14")+1); 4.14
-
Math.ceil(); 向上取整
-
JS中的数据类型：原始类型、引用类型
-
原始类型：Undefined、Number、String、Boolean、Null
-
引用类型：Object以及Object的子类。
-
-
常用函数
-
indexof 获取指定字符串在当前字符串中第一次出现处的索引 lastindexof 获取指定字符串在当前字符串中第一次出现处的索引 eg: alert("http://localhost:8080/javascript".indexof("http")); //0 alert("http://localhost:8080/javascript".indexof("https")); //-1 alert("http://localhost:8080/javascript".indexof("https") >=0 ? "包含":"不包含"); -
replace 替换(次方法只替换第一个) alert("name=value%name=value%name=value".replace("%","&")); -
substr和substring的区别？（重要） //截取字符串 //substr(startIndex,length) alert("abcdefx".substr(2,4)); //cdef //substring(startIndex,endIndex) 注意：不包含endIndex alert("abcdefx".substr(2,4)); //cd -
toLowerCase 转换小写
-
toUpperCase 转换大写
-
split 拆分字符串
-
-
在JS中怎么定义类？怎么new对象？
-
定义类的语法：
-
第一种
function 类名(形参){ } -
第二种
类名 = function(形参){ }
-
-
创建对象的语法：
-
new 构造方法名（实参）；//构造方法名和类名一致。
JS中类的定义，同时又是一个构造函数的定义 在JS中类的定义和构造函数的定义是放在一起来完成的 function User(a,b,c){ this.id = a; this.name = b; this.age = c; } //创建对象 var user = new User(101,"moyujina",20); //访问对象属性 alert(user.id); alert(user.name); alert(user.age);
-
-
-
可以通过prototype这个属性来给类动态扩展以及函数（相当于Java的重写）
Product.prototype.getPname = function(){ return this.pname } //调用后期扩展的getPname()函数 var pname = temp.getPname(); alert(pname)String.prototype.demo = function(){ alert("这是给String类型扩展的一个函数，叫做demo"); } "tzw".demo(); -
null 和 undefined 可以相同。 在JS当中有两个比较特殊的运算符： ==（等同运算符：只判断值是否相等） ===（全等运算符：既判断值是否相等，又判断数据类型是否相等） -
JS中的事件：
-
blur：失去焦点
-
change：下拉列表选中项改变或文本框内容改变
-
click：鼠标单击
-
dblclick：鼠标双击
-
focus：获得焦点
-
keydown：键盘按下
-
keyup：键盘弹起
-
load：页面加载完毕
-
mousedown：鼠标按下
-
mouseover：鼠标经过
-
mousemove：鼠标移动
-
mouseout：鼠标离开
-
mouseup：鼠标弹起
-
reset：表单重置
-
select：文本被选定
-
submit：表单提交
-
-
任何一个事件都会对应一个事件句柄，事件句柄是在事件前添加on。
-
注册事件的第一种方式，直接在标签中使用事件句柄
//对于当前程序来说，sayHello函数被称为回调函数（callback函数） //回调函数的特点：自己把这个函数代码写出来了，但是这个函数不是自己负责调用，由其它程序负责调用该函数 <input type="button" value="hello" onclick="sayHello()"/> <script> function sayHello(){ alert("hello js"); } </script> //在Java中也有： 站在方法的角度：是回调函数 站在调用者的角度：是正向调用 -
注册事件的第二种方式，使用纯 JS代码完成事件注册
<input type="button" value="hello" id="mybtn" /> <script type="text/javascript"> function doSome(){ alert("do some"); } //第一步：先获取这个按钮对象（document是全部小写，内置对象，可以直接使用，document就代表整个HTML页面） var btnObj = document.getElementById("mybtn"); //第二步：给按钮对象的onclick属性赋值 btnObj.onclick = doSome; //注意:不能加小括号：doSome(); </script> //合并： <input type="button" value="hello" id="mybtn2"> document.getElementById("mybtn2").onclick = function(){ alert("hello"); }
-
-
JavaScript包括三大块：
-
ECMAScript：JS的核心语法（ES规范 / ECMA-262标准）
-
DOM：Document Object Model（文档对象模型：对网页当中的节点进行增删改的过程）HTML文档被当作一棵DOM树来看待。
-
var domObj =document.getElementById("id");
-
-
BOM：Browser Object Model（浏览器对象模型）
-
关闭浏览器窗口、打开一个新的浏览器窗口、后退、前进、浏览器地址栏上的地址等，都是BOM编程。
-
-
DOM和BOM的区别和联系
-
BOM的顶级对象是：window
-
DOM的顶级对象是：document
-
实际上BOM是包括DOM的
-
图片
-
-
-
innerText 和 innerHTML属性有什么区别？
-
相同点：都是设置元素内部的内容
-
不同点：
-
innerHTML会把后面的“字符串”当做一段HTML代码解释并执行。
-
innerText，即使后面是一段HTML代码，也只是将其当作普通的字符串来看待。
-
-
-
什么是正则表达式，有什么用？
-
正则表达式：Regular Expression
-
正则表达式主要用在字符串格式匹配方面
-
正则表达式实际上是一门独立的学科，大部分编程语言都支持正则表达式。
-
常见的正则表达式符号：
-
. 匹配除换行符以外的任意字符
-
\w 匹配字母或数字下划线或汉字
-
\s 匹配任意的空白符
-
\d 匹配数字
-
\b 匹配单词的开始或结束
-
^ 匹配字符串的开始
-
$ 匹配字符串的结束
-
“*” 重复零次或更多次
-
“+” 重复一次或者更多次
-
“？” 重复零次或者一次
-
{n} 重复N次
-
{n,}重复n次或者更多次
-
{n,m} 重复n到m次
-
\W 匹配任意不是字母、数字、下划线、汉字的字符
-
\S 匹配任意不是空白符的字符
-
\D 匹配任意非数字的字符
-
\B 匹配不是单词开头的或结束的位置
-
[^x] 匹配除了x以外的任意字符
-
[^aeiou] 匹配除了aeiou这几个字母以外的任意字符
-
-
正则表达式当中的小括号()优先级较高。
-
[1-9] 表示1到9任意1个数字（次数是1）
-
[A-Za-z0-9]表示A-Za-z0-9中的任意1个字符
-
[A-Za-z0-9-] 表示A-Z、a-z、0-9、-，以上所有字符中的任意1个字符
-
-
QQ号的正则表达式
^[1-9][0-9]{4,}$ -
怎么创建正则表达式对象，怎么调用正则表达式对象的方法？
-
第一种创建方式：
var regExp = /正则表达式/flags; -
第二种创建方式：使用内置支持类RegExp
var regExp = new RegExp("正则表达式","flags");
-
-
关于flags：
-
g：全局匹配
-
i：忽略大小写
-
m：多行搜索（当前面是正则表达式的时候，m不能用。只有前面是普通字符串的时候，m才可以使用）
-
-
正则表达式对象的test()方法：
-
true / false = 正则表达式对象.test（用户填写的字符串);
-
true：字符串格式匹配成功
-
false：字符串格式匹配失败。
-
-
-
去除前后空白：
-
对象.trim();
-
-
判断复选框的选中状态：alert(对象.checked)
-
form表单有一个方法：submit()；在form表单添加id然后绑定事件，掉i用submit()；方法就可以提交表单。（此时input标签的type类型不应是submit）
-
判断复选框选中状态：对象.checked（选中为true，未选中为false）
-
网页中输出：document.write();
-
重写日期格式：
var t = new Date(); //直接获取时间格式：t.toLocaleString(); var year = t.getFullYear();//返回年的信息，以全格式返回 var month = t.getMonth();//月份是0-11 //var dayOfWeek = t.getDay();//获取一周的第几天 var day = t.getDate();//获取日期信息 document.write(year + "年" + (month+1) + "月" + day + "日");-
获取毫秒数：（从1970年1月1日 00:00:00 000 到当前时间的总毫秒数）
var times = t.getTime(); document.write(times); //合并 document.write(new Date().getTime());
-
-
BOM编程中，window对象是顶级对象，代表浏览器窗口
-
window有open和close方法，可以开启窗口和关闭窗口。
<input type="button" value="开启百度(新窗口)" onclick="window.open('http://www.baidu.com');"/> <input type="button" value="开启百度(当前窗口)" onclick="window.open('http://www.baidu.com','_self');"/> <input type="button" value="开启百度(新窗口)" onclick="window.open('http://www.baidu.com','_blank');"/> <input type="button" value="开启百度(父窗口)" onclick="window.open('http://www.baidu.com','_parent');"/> <input type="button" value="开启百度(顶级窗口)" onclick="window.open('http://www.baidu.com','_top');"/>
-
-
后退功能
<input type="button" value="后退" onclick="window.history.back()" /> //第二种方式： //go(1)为前进. <input type="button" value="后退" onclick="window.history.go(-1)" /> -
更改地址栏上的URL
<input type="buttom" value="百度" onclick="goBaiDu() "> <script> function goBaiDu(){ //href可以省略不写 //window改成document也行 window.location.href = "http://www.baidu.com"; } </script> -
有哪些方法可以通过浏览器往服务器发送请求？
-
表单form的提交
-
超链接
-
document.location
-
window.location
-
window.open('url')
-
-
如果当前窗口不是顶级窗口，将当前窗口设置为顶级窗口
if(window.top != window.self){ window.top.location = window.self.location; }
JSON
-
什么是JSON，有什么用？
-
JavaScript Object Notation（JavaScript对象标记），简称JSON。（数据交换格式）
-
JSON主要的作用是：一种标准的数据交换格式。
-
-
JSON是一种标准的轻量级的数据交换格式。特点是：
-
体积小，易解析。
-
-
JSON语法格式：
var jsonObj = { "属性名":属性值, "属性名":属性值, "属性名":属性值 }; -
创建JSON对象
var student = { "no":"110", "name":"张三", "sex":"男" }; -
JSON数组
var students = [ {"no":"110","name":"张三","sex":"男"}, {"no":"120","name":"李四","sex":"女"}, {"no":"130","name":"王五","sex":"男"} ]; //遍历 for(var i = 0; i < studnts.length; i++){ var stuObj = students[i]; alert(stuObj.no + stuObj.name + stuObj.sex); } -
eval函数的作用：（window.eval("var i = 100;");）
-
将字符串当作一段JS代码解释并执行，将json格式的字符串转换成json对象。
-
-
Java中的数组：int[] arr = {1,2,3};
-
JS中的数组：var arr = [1,2,3];
-
JSON：var jsonObj = {"id" :"12","name":"张三"};
-
将json字符串转化为json对象 JSONObject obj=JSON.parseObject(jsonStr);//将json字符串转换为json对象
- 点赞
- 收藏
- 关注作者
评论（0）