JavaScript基础语法

目录

1.  变量

1.1  变量的声明

1.2  变量的注意点

1.3  变量提升

2.  数据类型

2.1  六种类型:

2.2  undefined:

2.3  使用Null类型值时注意以下几点:

2.4  数值型

3.  函数转换

3.1  parseInt()

3.2  parseFloat()

3.3  显示转换

4.  全等与相等

5.  数组

5.1  定义

5.2  数组特点

5.3  数组的遍历

5.5  数组方法

6.  函数

6.1  函数的定义

6.2  函数的参数

6.3  函数的调用

6.4  函数作用域

7.  内置对象

8.  对象

8.1  对象的创建

8.2  对象的序列化和反序列化

8.2.1  对象的序列化

8.2.2  对象的反序列化

8.3  this


1.  变量

1.1  变量的声明

// 1. 声明并赋值
var str = "Hello World";
console.log(str);
// 2. 先声明再赋值
var str2; // 声明
str2 = "hello"; // 赋值

1.2  变量的注意点

// 1. 当变量只声明而未赋值时,则变量的值会返回undfinded
		var a;
		console.log(a); // undefined
		
// 变量要有定义才能使用,若变量未声明就使用,JavaScript会报错,告诉你变量未定义。
		// console.log(b); //  b is not defined
		
// 3. 可以在同一条var命令中声明多个变量。
		var aa=1,bb=2,cc=10;
		console.log(aa,bb,cc);
		
// 4. 若使用var重新声明一个已经存在的变量,是无效的。
		var str;
		console.log(str);
		
// 5. 若使用var重新声明一个已经存在的变量且赋值,则会覆盖掉前面的值
		var str = '你好';
		console.log(str);
		
// 6. JavaScript是一种动态类型、弱类型语言,也就是说,变量的类型没有限制,可以赋予各种类型的值。
		var flag = true;
		console.log(true);

1.3  变量提升

JavaScript 引擎的工作方式是,先解析代码,获取所有被声明的变量,然后再一行一行地运行。这造成的结果,就是所有的变量的声明语句,都会被提升到代码的头部,这就叫做变量提升。 注:只有用var声明的变量,才会变量声明。

console.log(uname); // undefined
var uname = "zhangsan";
var uname;
console.log(uname);
uname = "zs";
  • let与var作用域不同:let是局部变量,不能重复定义,只在let关键字所在的代码块中有效;var是全局变量
  • const:常量,不能改变

2.  数据类型

2.1  六种类型:

数值型,布尔型,字符型,null,undefined,对象(数组,函数,对象)

2.2  undefined:

        1. 当声明了变量但未赋值时,这个变量的值就是undefined

        2. 调用函数(方法)时,函数有形参,但未提供实参,则参数为undefined

        3. 函数没有返回值,默认返回undefined

2.3  使用Null类型值时注意以下几点:

1)使用typeof操作符测试null返回object字符串。

var c = null;

console.log(null);

console.log(typeof null); // object

2)undefined派生自null,所以等值比较返回值是true。未初始化的变量和赋值为null的变量相等。

2.4  数值型

在存储数值时会自动将整型的浮点数值(1.0)转换成整型(1)

3.  函数转换

3.1  parseInt()

在转换之前,首先会分析该字符串,判断位置为0处的字符,判断它是否是个有效数字,如果不是,则直接返回NaN,不再继续,如果是则继续,直到找到非字符

3.2  parseFloat()

在转换之前,首先会分析该字符串,判断位置为0处的字符,判断它是否是个有效数字,如果不是,则直接返回NaN,不再继续,如果是则继续,直到找到非字符。可以识别第一个小数点

/* parseInt() */
console.log(parseInt("123abc")); // 123
console.log(parseInt("123.45")); // 123
console.log(parseInt("abc")); // NaN
		
/* parseFloat() */
console.log(parseFloat("123abc")); // 123
console.log(parseFloat("123.45")); // 123.45
console.log(parseFloat("abc")); // NaN
console.log(parseFloat("12.34.56")); // 12.34

3.3  显示转换

        // toString
		var data = 10;
		console.log(data);
		console.log(data.toString());
		var data1 = null;
		// console.log(data1.toString()); // Cannot read property 'toString' of null
		
		// toFixed()
		var data2 = 1.4;
		console.log(data2.toFixed(0)); // 1
		var data3 = 1.46;
		console.log(data3.toFixed(1));  // 1.5
		
		console.log("==========");
		// Number
		console.log(Number( "5.5 ")); // 5.5
		console.log(Number( "56 ")); // 56
		console.log(Number( "5.6.7 ")); // NaN
		
		
		// 将任意值转换成字符串,包括null和undefinded
		var qq = null;
		console.log(String(qq));
		var flag = true;
		console.log(flag+"");

其他类型转换布尔类型:Number:0和NaN为false,其他均转为true

                                        String:空字符串为false,其他为true(包括空格字符串)

                                        Null和undefined:转为false

4.  全等与相等

==        相等,比较值是否相等,会进行类型转换

===     全等,比较值和类型是否相等,不会进行类型转换

5.  数组

5.1  定义

var arr = [值1,值2,值3];  // 隐式创建

var arr = new Array(值1,值2,值3); // 直接实例化

var arr = new Array(size); // 创建数组并指定长度

5.2  数组特点

  • 长度可变;
  • 数组中类型任意;
  • 索引从零开始,可以越界;
  • 可以使用任意字符当作数组的索引,如果索引是非正整数,我们称之为数组的属性,属性不影响数组的长度 

5.3  数组的遍历

for ——> 不遍历属性

foreach ——>不遍历属性和索引中的undefined

for in ——>不遍历索引中的undefined

5.5  数组方法

*push          添加元素到最后

unshift       添加元素到最前

pop           删除最后一项

shift         删除第一项

*reverse       数组翻转

*join          数组转成字符串,通过()里的符号拼接

*indexOf       数组元素索引,写索引或者里面的元素

slice         截取(切片)数组,原数组不发生变化

splice        剪接数组,原数组变化,可以实现前后删除效果

concat        数组合并

6.  函数

6.1  函数的定义

1. 函数声明语句(具有函数名提升的效果)

      function 函数名([参数列表]) { ..... }

2. 函数定义表达式

      var 变量名 = function([参数列表]) { ..... }

3. Function构造函数

      var 变量名 = new Function('a','b','return (a+b)');

注:JS中没有函数重载,只会覆盖同名函数

6.2  函数的参数

        // 实参可以省略,那么对应形参为undefined
		function fn(str) {
			console.log(str); // undefined
		}
		fn();
		// 若函数形参同名(一般不会这么干):在使用时以最后一个值为准。
		function fn2(a,a) {
			console.log(a);
		}
		fn2(1,2);
		
		// 可以给参数默认值:当参数为特殊值时,可以赋予默认值。
		function fn3(a) {
			a = a || "a";
			return a;
		}
		var a1 = fn3();
		console.log(a1);
		var a2 = fn3(100);
		console.log(a2);
		
		// 参数为值传递,传递副本;引用传递时传递地址,操作的是同一个对象。
		// 值传递
		var n = 10;
		function fn4(num) {
			num = 20;
		}
		fn4(n);
		console.log(n);
		
		// 引用传递
		var obj = {
			uname:"zhangsan",
			upwd:"123456"
		};
		function fn5(o){
			o.uname = "lisi"; // 修改对象中的属性值
		}
		fn5(obj);
		console.log(obj);

6.3  函数的调用

        // 函数调用模式
		function add(a,b) {
			return a+b;
		}
		var sum = add(10,20);
		console.log(sum);
		
		// 对象调用对象
		var ob = {
			name:"zs",
			age:18,
			sex:true,
			test:function(){
				console.log("对象调用对象...");
			}
		};
		ob.test();

6.4  函数作用域

// 1. 全局变量与局部变量同名问题
// 2. 在函数中定义变量时,若没有加var关键字,使用之后自动变为全局变量
var bb = 10; // 全局变量
function abc(b) {
	var b = 100;  // 局部变量
	var bb = 200; // 局部变量 与全局变量bb没有关系,相当于新声明的变量
	console.log(bb); // 就近原则
	c = 12; // 没有var修饰符,则是全局变量
}
abc(bb);
// console.log(b); //  b is not defined
console.log(bb); // 只能获取全局变量
console.log(c);

7.  内置对象

String

                ◦ charAt(idx)      返回指定位置处的字符

                ◦ indexOf(Chr)     返回指定子字符串的位置,从左到右。找不到返回-1

                ◦ substr(m,n)      返回给定字符串中从m位置开始,取n个字符,如果参数n省略,

                                          则意味着取到字符串末尾。

                ◦ substring(m,n)   返回给定字符串中从m位置开始,到n位置结束,如果参数n省

                                           略,则意味着取到字符串末尾。

                ◦ toLowerCase()    将字符串中的字符全部转化成小写。

                ◦ toUpperCase()    将字符串中的字符全部转化成大写。

                ◦ length           属性,不是方法,返回字符串的长度。

Math

                ◦ Math.random()    随机数

                ◦ Math.ceil()      向上取整,大于最大整数

                ◦ Math.floor()     向小取整,小于最小整数String

Date:

                1. getMonth():得到的值:0~11(1月~12月)

                2. setMonth():设置值时0~11

                3. toLocaleString():可根据本地时间把 Date 对象转换为字符串,并返回结果。

8.  对象

8.1  对象的创建

        // 1. 字面量形式创建对象
		var obj = {}; // 空对象
		obj.uname = "zhangsan"
		obj.uage =18;
		console.log(obj);
		// 非空对象 (键都是字符串,值可以是六种数据类型中任意一种)
		var obj2 = {
			uname:"zhangsan", // 字符串
			uage:18, // 数值
			islike:true, // 布尔值
			sayHello:function(){ // 函数
				console.log("Hello...");
			},
			cats:['大毛','喵喵'], // 数组
			dog:{ // 对象
				name:"张二狗",
				age:1
			}
		};
		console.log(obj2);
		console.log(obj2.uname);
		obj2.sayHello(); // 方法调用模式
		obj2.uage = 19;
		
		// 2. 通过new Object创建
		var obj3 = new Object();
		obj3.name="lisa";
		console.log(obj3);
		
		// 3. 通过Object对象的create方法创建
		var obj4 = Object.create(null);
		console.log(obj4.name);
		var obj5 = Object.create(obj3);
		console.log(obj5.name);

8.2  对象的序列化和反序列化

8.2.1  对象的序列化

将对象转为字符串                

JSON.stringify(object);

8.2.2  对象的反序列化

将一个Json字符串转换为对象。

JSON.parse(jsonStr);

8.3  this

this指的是,调用函数的那个对象。

        // 在函数中使用
		function test () {
			this.x = 1;
			console.log(this.x);
		}
		test(); // 调用者是window对象
		console.log(x); // 相当于定义在全局对象上的属性
		console.log(this);
		 
		// 在对象中使用
		var o = {
			name : '张三',
			age : 20,
			sayHello : function () {
				console.log(this.name)
				console.log(this)
			}
		}
		o.sayHello(); // 调用者是o这个对象
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值