1.js基础
建议:一般情况下不在head标签中写js语句,因为该js语句会在body加载之前就执行,可能导致某些效果无效
// 单行注释
/*多行
* 注释*/
// 控制台输出语句
console.log('hello world');
// 浏览器的提示框
alert('这是一个提示框');
//页面展示
document.write('hello world');
document.write('<h1>alert</h1>');
2.数据类型
一、基本数据类型
- Number:数字类型 整型 浮点型 NaN(不是一个数字) Infinity(不能处理的数字)
- String字符串,使用单引号或双引号的任意多个字符
- boolean:true false
- undefined:未定义类型 当定义变量时未赋值,默认为undefined类型,值为undefined
- null:空类型,代表空值或没有值,空类型的值为null
null与undefined区别,当变量定义了但未赋值,默认值为undefined,当变量定义了并且赋予值为null时 ,为空类型
二、引用数据类型
- String:字符串
- Array:数组
3.Number类型
var num;
console.log(num); //undefined
console.log(typeof num); //undefined
var num = 20;
console.log(typeof num); // number
console.log(num);
// 变量的数据类型根据赋值的类型而定
// 定义一个八进制数
// js八进制数以0开头
var num3 = 056; // 以十进制格式输出
console.log(num3); // 46
// 定义十六进制
var num4 = 0x56
console.log(num4) // 86
// js中最大的数为1e308
console.log(1e308); //1e+308
// Infinity 特殊的number类型 特殊的值 当处理超出js的数值范围时
console.log(1e309); // infinity
console.log(typeof Infinity) // number类型
console.log(10/0)
// Infinity与其他任何数字进行数学计算 ,值依旧是Infinity
console.log(Infinity+(-Infinity)); // NaN
// NaN 表示不是一个数字,但是NaN是Number类型,只不过Number中
// 一个特殊的值
console.log(typeof NaN) //Number类型
//当运算符使用错误时,运算失败返回NaN
console.log('f' * 3); // NaN
// NaN与任何数字进行运算都是NaN
console.log(1 + 2 + NaN)
console.log(Infinity + NaN); // NaN
4.Boolean类型
- 数字 :0 0.0 NaN
- 字符串: 空字符串
- 空值类型:null
- 未定义类型:undefined
以上为false, 除以上情况都为真
5.命名空间
在同一个html文件中,所有的script共用同一个命名空间
<script type="text/javascript">
var a = 200;
console.log(a);
</script>
<script type="text/javascript">
console.log(a) // 200
</script>
6.字符串相关操作
// 一、字符串的拼接
//字符串拼接 +
console.log('hello '+ 'world');
// 字符串+数字 变成字符串
console.log('1'+2); // '12'
// 当运算符前后都是数字类型时 进行数学运算
console.log(1+2+'3'); // '33'
console.log('1'+2+3); // '123'
console.log(typeof 1+2+'3'); // number23
console.log(typeof (1+2+'3')); //string
// 二、定义引用类型的字符串!!!
// new String()
// new:开辟空间 返回一个对象
// new: 创建一个类的实例对象的关键字, String():字符串的一个类
var str3 = new String('我是好人')
console.log(str3)
console.log(typeof str3); // object
// string 基本数据类型
// object 引用数据类型
// 二者本质上的数据类型是不一样的
// 在实际操作中, 基本数据类型会自动转为引用数据类型,我们可以
// 用基本数据类型调用引用数据类型的方法或属性
// 三、字符串是不可变的数据类型
// 四、字符串的相关方法
//1-字符串长度
var str5 = 'abcd';
var str6 = new String('qwert');
console.log(str5.length)
console.log(str6.length)
//2-大小写转行
var str7 = 'ABCdef';
console.log(str7.toLowerCase());
console.log(str7.toUpperCase());
//3-字符串比较 比较acsii的值
var str8 = 'abc';
var str9 = 'auc';
var res = str8.localeCompare(str9); // -1 代表小于
console.log(res)
//4-ascii值转为字符
var str10 = String.fromCharCode(97);
console.log(str10); // a
console.log(typeof str10); // string
// 5-获取字符串中某个下标的字符
console.log(str8.charAt(2)); // c
console.log(str8[2]);
console.log(str8.charAt(4)); // '' 下标越界不会报错 是空
// 6-字符串转ASCII charCodeAt(下标)
console.log(str8.charCodeAt(2)); //99
// 7-判断是否相等
// == :js中会自动进行数据转行再进行比较
// !=
// ===: 值与数据类型是否一致
// !==
var num1 = 10;
var num2 = '10';
console.log(num1 == num2) // 10==10 10=='10'
console.log(num1 === num2) // false
// 8-字符串替换
// replace(旧字符串/正则表达式, 字符串)
// replace:目前只替换一次,如果想要全部替换需要正则
var str11 = 'today is cool and cood so cool';
console.log(str11.replace('cool', 'hot')); //换一次
console.log(str11.replace(/cool/g, 'hot')); // global 全局查找
// 9-切割字符串
// 如果不需要空字符串 也是需要正则的
console.log(str11.split(' '));
console.log(str11.split(/ +/))
// 10-将数组中元素拼接为字符 和Python相反
arr1 = [1,2,3,4]
console.log(arr1.join('*'));
// 11-字符串截取
var str12 = 'abcdefghidefgk'
console.log(str12.substring(2)); //从第三个下标开始截取 cdefghigk
console.log(str12.substring(1,5)); // 5不包括
// substr 第二个参数是截取的个数
console.log(str12.substr(2));
console.log(str12.substr(1,5));
//12-字符串查找
// indexOf:当能够找到:返回第一次找到的下标
// 找不到 返回-1
console.log(str12.indexOf('def'));
console.log(str12.indexOf('rrr'));
// 从右向左找
console.log(str12.lastIndexOf('def'));
7.关系运算符与逻辑运算符
console.log(1>'2'); // false
console.log(1=='1'); // true
console.log(1==='1') // false
console.log(5 / 2) // 2.5 Number
// true-> 1 false -> 0
console.log(1+true); //2
console.log(1+ false); //1
// null->0
console.log(1+ null); // 1
// undefined->NaN
console.log(1+undefined)// NaN
&& || ! ++ --
8.提示框类型
// alert
// confirm 有确定及取消两个按钮
// confirm 有返回值 点确定按钮时候返回true
var res = confirm('在么');
if(res == true){
console.log('66');
}else{
console.log('滚');
}
//prompt 有返回值
//点击确定按钮时候,返回输入框的文字
// 点击取消 返回 null
res= prompt('请输入');
document.write(res);