JavaScript（数据类型、字符串操作）

JS基础

建议：一般情况下不在 head 标签中写 js 语句，因为该 js 语句会在 body 加载之前就执行，可能导致某些效果无效

// 单行注释
/*多行
* 注释*/
// 控制台输出语句
console.log('hello world');

// 浏览器的提示框
alert('这是一个提示框');

//页面展示
document.write('hello world');
document.write('<h1>alert</h1>');

数据类型

基本数据类型

• Number：数字类型 整型 浮点型 NaN(不是一个数字) Infinity(不能处理的数字)
• String：字符串，使用单引号或双引号的任意多个字符
• boolean：true false
• undefined：未定义类型 当定义变量时未赋值，默认为undefined类型，值为undefined
• null：空类型，代表空值或没有值，空类型的值为null

null 与 undefined 区别：当变量定义了但未赋值，默认值为 undefined，当变量定义了并且赋予值为 null 时 ，为空类型

引用数据类型

• String：字符串
• Array：数组

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

Boolean类型

• 数字 ：0、0.0、NaN
• 字符串： 空字符串
• 空值类型：null
• 未定义类型：undefined

以上为 false， 除以上情况都为真

命名空间

在同一个html文件中，所有的script共用同一个命名空间

    <script type="text/javascript">
        var a = 200;
        console.log(a);
    </script>

    <script type="text/javascript">
        console.log(a)  // 200
    </script>

字符串相关操作

// 一、字符串的拼接
// 字符串拼接 +
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'));

关系运算符与逻辑运算符

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

&& || ！ ++ --

提示框类型

// alert
// confirm 有确定及取消两个按钮
// confirm 有返回值 点确定按钮时候返回true
var res = confirm('在么');
if(res == true){
    console.log('66');
}else{
    console.log('滚');
}

//prompt 有返回值
//点击确定按钮时候，返回输入框的文字
// 点击取消 返回 null
res= prompt('请输入');
document.write(res);