JS基础(一)引入方式,基本语法,数据类型,类型转换,原始类型和引用类型的区别
JS和python很像滴,好学,快快过一遍
一、JS引入方式
<script> // js 的代码 alert("hello alvin!") </script>
二、JS基本语法
打印console.log作为日志打印,在浏览器里f12检查,console可以看见。
区分大小写哦。
JS中可以用换行作为分隔符(python中),不过更推荐使用换行+分号 ; 作为分隔符。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> // 变量的先声明再赋值 var x ; x = 10; console.log(x); // 声明并赋值 var y = 20; // 一行声明多个变量 var a = 1,b=2; c = 3; // 声明了一个全局变量 console.log(c); // 单行注释 /* 多行注释 多行注释 多行注释 */ var name = "alvin" ;var age =18;console.log(name,age); var q = 10; var w = q; w =20 ; </script> </head> <body> </body> </html>
三、JS数据类型
原始类型:字符串、数字、布尔、null、undefined
对象类型:数组、object、函数对象、日期Date、错误Error、正则RegExp、内置对象(Json、Math、arguments)
3.1 数字类型
JS中没有整形和浮点型,只有number类型
<script> var x = 10; var y = 3.14; console.log(x,typeof x); // 10 "number" console.log(y,typeof y); // 3.14 "number" </script>
3.2 字符串类型
字符串创建两种方式:
- 变量="字符串"
- 字符串对象名称=new String(字符串)
<script>
// 字符串创建
var s1 = "hello world";
var s2 = new String("hello world") // 和Java一样 了解即可,一般用上面那种
console.log(s1.length);
console.log(s1.toUpperCase());
console.log(s1.indexOf("l"));
console.log(s1[2]);
// 切片操作
console.log(s1.slice(1,4)); // ell 顾头不顾尾 和python一样
console.log(s1.slice(0,4));
console.log(s1.slice(0,-1));//hello worl -1是从最后开始少取一个
console.log(s1.slice());
console.log(s1.slice(3)); // 缺省的情况 lo world 从3取到最后一个
console.log(s1.slice(-4,-1)); // 负数就是从右往左数,orld
console.log(s1.slice(-1,-4)); // 这样就是错的,-4在-1左边,最后不会报错,但是什么都没有 ""
// split分割方法 python也有,完全一样
var ret = s1.split(" ");
console.log(ret); // ["hello", "world"]
// substr截断方法
console.log(s1.substr(2,2));
var password = " ge llo ";
console.log(password.trim()); // ge llo 中间的空格不会去掉
console.log(password.trim().length);
</script>
3.3 布尔类型
<script> var b1 = false; var b2 = true; console.log(b1,typeof b1); // false "boolean" console.log(2 > 3); console.log(5 > 3); console.log(true+1); </script>
3.4 空值类型
undefined和null
- 当声明的变量未初始化时,该变量默认是undefined
- 当函数无明确返回值时,返回的也是undefined
值undefined实际上是从null派生来的,多以ECMAScript把他们定义为相等的。尽管值相等,含义却不同。null用于表示尚未存在的对象,如果函数或者方法返回的对象,但是找不大该对象,那就是null。
<script> var s; console.log(s,typeof s); // undefined "undefined" function foo() { console.log("foo函数") } console.log(foo()) ; // undefined console.log(undefined == null) // true </script>
四、类型转换
强制转换和自动转换。
<script> // 转换number类型 var box1 = "一共100件"; // 转换会失败 var box2 = "100件"; // 转换会成功 var box3 = "100"; // 转换会成功 var ret = parseInt(box3); console.log(ret); // NaN 属于number类型 var box5 = "3.14"; console.log(parseFloat(box5) ); // 3.14 // var box6 = "3.1.4"; // 使用Number转换的数据里面必须是纯数字!!!!否则都会转换失败 console.log(parseFloat(box6)); console.log(Number(box6)); // NaN 很严谨,只要不是纯数字,结果就是NAN not a number console.log(Number(box2)); // NaN // 转换字符串类型 .toString() var x = 100; console.log(x.toString(),typeof x.toString()); var b = true; console.log(b.toString(),typeof b.toString()); // 转换布尔类型(零值) // console.log(Boolean(4>5)); // console.log(Boolean(8>5)); // 零值系统 就是任何一个数据类型下面只有一个值对应的是false console.log(Boolean("")); // FALSE 空字符串就是字符串的零值 console.log(Boolean(0)); console.log(Boolean(1)); console.log(Boolean(-1)); console.log(Boolean("0")); // TRUE console.log(Boolean(null)); console.log(Boolean(undefined)); // 比较特殊的是null和undefined都是对应零值 console.log(Boolean([])); console.log(Boolean({})); if("false"){ // TRUE console.log("注意哦!") } console.log(1=="1"); console.log(1+"200",typeof (1+"200")); console.log(1-"200",typeof (1-"200")); </script>
五、原始数据类型和引用数据类型的区分
原始数据类型存放在栈中,当把一个原始变量传递给另一个原始变量时,是把一个栈空间的东西赋值到另一个栈房间,且两个原始变量互不影响。
引用值是把引用变量的名称存储在栈中,但是吧实际对象存储在堆中,且存在一个指针由变量名指向存储在堆中的实际对象,当把引用对象传递给另一个变量的时候,复制的是指向实际变量的指针,此时两者指向的其实是同一个数据,所以改变其中一个另一个的值也会随之改变。但是如果不是通过方法而是通过重新赋值,另一个的值不会随之改变。
<script> // 对象类型 var arr1=[1,2]; arr2 = arr1; arr1.push(3); console.log(arr1);// [1,2,3] console.log(arr2);//[1,2,3] arr1=[4,5]; console.log(arr1);//[4,5] console.log(arr2);//[1,2,3] </script>