JS学习
1.输出
alert(); //页面弹窗
document.write();//向body中输出内容
console.log();//控制台输出
2.注意事项
- JS严格区分大小写
- 每一条语句以分号结尾–(如果不写分号,浏览器会自动添加,但是会消耗一些系统资源,而且有时候浏览器分号会加错)
- JS会忽略多个空格和换行
3.数据类型
基本类型:指直接保存在栈内存中,
- String 字符串
- 使用双引号、单引号都可以。引号不能嵌套。 \转义字符
var str1 = 'hello';
var str2 = "hello";
str1 = "i say : 'today is a good day!' ";
- Number 数值 (没有整数和浮点数之分,进行浮点运算,会出现精度不精确的问题)
- Infinity 正无穷
- -Infinity 负无穷
- NaN 非类型
- typeof 检查类型
var a = Number.MIN_VALUE; //大于0的最小数5e-324
console.log(typeof a);
- Boolean 布尔值
- true or false
var bool = true;
console.log(typeof bool);
- Null 空值
- Null类型的值只有一个null
- null表示为空的对象
var a = null;
console.log(typeof a); //object
- Undefined 未定义
var b = undefied;
console.log(b);// undefied
console.log(typeof b); //undefied
引用类型:指存在堆内存
- Object 对象
对象分类:
1.内置对象
-ES标准中定义的对象,在任何的ES的实现中都可以使用
-比如:Math Sting Number Boolean Function Object...
2.宿主对象
-由JS的运行环境提供的环境对象,目前来讲主要指由浏览器提供的对象
-比如BOM DOM
3.自定义对象
- 由开发人员自己创建的对象
对象的创建:
1. var obj = new Object();
2. var obj = {};
obj.name = "孙悟空";
var obj2 = {
name:"猪八戒",
age:28,
gender:"男"
};
-- 对象字面量的属性名可以加引号也可以不加,建议不加。如果使用一些特殊的名字,必须加引号
-- 名和值之间使用:连接,多个名和值直接使用,隔开
var obj2 = {
name:"猪八戒";
age:28,
gender:"男",
test:{name:"沙和尚"}
};
强制类型转换
var a = 123;
将其他类型转换成字符串
方法一:调用被转换类型的toString()的方法
1.null和undefined没有toString()方法,调用会报错
方法二:调String()函数,
a.toString();
a = 123;
a = String(a);
将其他类型转换为number方法一:调用Number()方法
字符串-->数字
1.纯数字的字符串,则转化为数字
2.如果字符串含有非数字内容,则转换为NaN
3.如果字符串 一个空串或者全是空格的字符串,转化为0
4.Boolean转化为数字,true->1,false->0
5.null-->0
6.undefied-->NaN
转换方法二:
parsInt()方法专门对付字符串,将一个字符串中第一个有效的整数内容取出来
a = '123adac'
a = paseInt(a); // a = 123
parseFloat()取浮点数
a = Number(a);
a = 0x10; //0x开头是十六进制
a = 0xff;
a = 007;//0开头是八进制
a = 0b10;//0b开头二进制
a = paseInt(a,10);//第二个参数,用来指定进制
转换为Boolean值
调用Boolean()函数
数字非0--->true
数字0和NaN--->false
非空字符串-->true
空串--->false
null和undefined ---> false
object -->true
质数练习:
<script>
// 求 2-num之间的质数
var num = prompt("");
boolean flag = true;
if (num <= 1){
alert("");
}else{
for(var i = 2; i < num; i++){
flag = true;
for(var j = 2; j*j <= i; j++){
// Math.sqrt(i)
if(i%j == 0){
flag = false;
break;
}
}
if(flag == true){
console.log(i + " ");
}
}
}
</script>
4.Unicode转义字符编码
js中 \u
unicode编码
console.log('\u2620');
- 在网页中使用Unicode编码
&#编码
; 需要转换为十进制<h1 style="font-size: 200px">☠</h1>
5.正则表达式(定义字符串的规则)
创建正则表达式的对象
语法:
- var 变量 = new RegExp("正则表达式","匹配模式");
- 使用typeof检查正则对象性,会返回object
- var reg = new RegExp("a");这个正则表达式可以用来检测一个字符串是否含有a
在构造函数中,可以传递一个匹配模式作为第二个参数。(更灵活)
可以是
- i 忽略大小写
- g 全局匹配模式
正则表达式的方法:test(),用于检测一个字符串是否符合正则表达式
var str = "a";
var result = re.test(str);
consolo.log(result);
- 使用字面量来创建正则表达(更简单)
- 语法: var 变量 = /正则表达式/匹配模式
var reg = /a/i;
reg = /a|b|c/;
- | 表示或的意思
- [] 里面的内容也是或的关系
- [ab] == a|b
- [a-z] 任意小写字母
- [A-Z] 任意大写字母
- [A-z] 任意字母
- [^ab] 除了ab以外的
- . 表示任意字符
- \. 转义字符 表示.
- \w 任意字母、数字、_ ==>[A-z0-9]
- \W 除了任意字母、数字、_==>[^A-z0-9]
- \d 任意数字 [0-9]
- \D 除了数字 [^0-9]
- \s 空格
- \S 除了空格
- g 全局匹配模式 reg = /s/g;
- \b 单词边界 reg = /\bchild\b/;
- \B 除了单词边界
量词
- 通过量词可以设置一个内容出现的次数
- 量词只对它前面的一个内容起作用
- {n} 正好出现n次
- {1,3} 出现 1~3次 reg = /a{1,3}/;
- {3,} 出现3次以上 reg = /a{3,}b/;
- + 至少一个 ==>{1,}
- * 0个或者多个 ==>{0,}
- ? 0个或者1个 ==>{0,1}
- ^a 检查一个字符串开头是否以a开头
- a$ 结尾是否为a
reg = /[a-z]/; //任意小写字母
reg = /[^ab]/; //除了ab以外的
手机号的规则:
- 以1开头
- 第二位是3-9的任意数字
- 三位以后任意数 9位
- /^1[3-9][0-9]{9}$/
var phoneStr = "123567890123";
var phoneReg = /^1[3-9][0-9]{9}$/;
console.log(phoneReg.test(phoneStr));
match()
-可以根据正则表达式,从一个字符串中将符合条件的内容提取出来
-默认情况下我们的match只会找到第一个符合要求的内容,找到后救停止检索
我们可以设置正则表达式为全局匹配模式,这样就会匹配到所有内容
-match()会将匹配到的内容封装到一个数组中返回,即使只查询到一个结果
replace()
-可以将 字符串中自定内容替换为新的内容
-参数:
1.被替换的内容,可以接受一个正则表达式作为参数
2.新的内容
-默认只会替换第一个
split()
-可以将一个字符串拆分为一个数组
-方法中可以传递一个正则表达式作为参数,这样方法会根据正则表达式去拆分字符串
- 这个方法默认全局匹配
search()
-可以搜索字符串中是否含有指定内容
-如果搜索到指定内容,则会返回第一次出现的索引,如果没有搜索到,就返回-1
-它可以接受一个正则表达式作为参数,然后会根据正则表达式去检索字符串
6.DOM树(Document Object Model)
js是解释型语言,代码的执行顺序是自上而下。
var btn = document.getElementById("btn");
btn.onclick = function(){
alert("hello");
};
//先加载js 再加载页面
window.onload = function(){
var btn = document.getElementById("btn");
btn.onclick = function(){
alert("hello");
};
};
- getElementById()//通过id获取一个元素节点对象
- getElementByTagName()//通过标签名获取一组元素节点对象
- getElementsByname() // 通过name属性获取一组元素节点对象
7.函数
- 函数也是一个对象
- 函数中可以封装一些功能(代码)
//可以将要封装的代码以字符串的形式传递给构造函数,
//封装到函数的代码不会立即执行
var fun = new Function("console.log('hello');");
fun(); //调用