11.09 JavaScript基础
来源:互联网 发布:范斯沃斯住宅全面数据 编辑:程序博客网 时间:2024/06/07 00:37
一切皆对象
1.什么是对象
世间任何一个我们需要进行研究的事物都是一个对象。对象具有状态,一个对象用数据值来描述它的状态。对象还有操作,用于改变对象的状态,对象及其操作就是对象的行为。
2.怎样构造对象
var person={ "name":"小明", "age":"18", "like":function(){ return "喜欢打篮球,弹吉他" } } var person=new Object(); person.name='小明'; person.sex='男'; person.method=function(){ return this.name+this.sex; }
3.属性的操作
有两种方式读取对象的属性,一种使用点运算符,还有一种是使用方括号运算符。
var obj = { name : "Tom", age : 27, sex : true, 3:"333"};console.log(obj.name); // Tomconsole.log(obj["name"]); // Tomconsole.log(obj[3]); // 333
4.检查变量是否声明
在判断属性在变量中是否存在的时候,我们一般使用in运算符进行判断,虽然直接(obj.score)有时也会达到一样的效果,但是有漏洞,比如socre的属性为“”或false时,就会达不到预期的效果。
var obj = { name : "Tom", age : 27, sex : true, 3:"333", score : ""};if (obj.score) { console.log("score is exist");} else { console.log("score is not exist");}// score is not exist// 要求使用 in 这种严谨的判断方式if ("score" in obj) { console.log("score is exist");} else { console.log("score is not exist");}// score is exist
5.属性的赋值
可以通过点操作符和方括号操作符对对象的属性进行赋值。
Javascript允许对对象的属性进行“后绑定”,你可以在变量声明后的任意时刻,新增属性,并进行赋值,没有必要在对象定义的时候,就把对象的属性都定义好。
var tobj = {};tobj.name = "Jack";tobj["age"] = 20;console.log(tobj.name + " " + tobj.age ); // Jack 20
6.查看所有属性
通过Object.keys(obj)方法获取到所有的属性数组
var tobj = {};tobj.name = "Jack";tobj["age"] = 20; console.log(Object.keys(tobj)); ["name","age"]
7.delete命令
delete命令用于删除对象的某个属性,如果删除成功,返回true。
var tobj = {};tobj.name = "Jack";tobj["age"] = 20;console.log(tobj.name + " " + tobj.age );console.log(Object.keys(tobj)); // ["name","age"]delete tobj.name;console.log(tobj.name); // undefinedconsole.log(Object.keys(tobj)); // ["age"]
条件语句
1.switch结构
switch我们一般用在多个离散的值进行条件判断时使用,特别是有很多的值的时候。
var monthNum = 2;switch (monthNum){ case 1: console.log("一月"); break; case 2: console.log("二月"); break; case 3: console.log("三月"); break; case 4: console.log("四月"); break;}var sex = "man";switch (sex){ case "man": console.log("man"); break; case "woman": console.log("woman"); break; default: console.log("in default");}
2. 三元运算符
三元运算符我们一般用简单的逻辑判断和赋值语句中。
var sexFlag = 2; var sexStr; if (sexFlag === 1) { sexStr = "man"; } else { sexStr = "woman"; } // 语法(condition) ? expre1 : expre2; // 实现的效果和上述的if...else结构一样 sexStr = (sexFlag === 1 ? "3-man" : "3-woman"); console.log(sexStr);
循环语句
1.for循环
for循环可以指定循环的起点、终点和终止条件。
语法:
for (initialize ; test; increment) { statement; }
- initialize 初始化表达式:确定循环的开始条件,只在循环开始的时候执行一次。
- test 测试表达式:检查循环条件,只要为真就执行循环体的内容。
- increment 递增表达式:完成后续操作,然后返回上一步,再一次检查条件。
var sumifor = 0; for (var i = 1; i <= 10000; i++) { sumifor = sumifor + i; } document.write("<br/>sumifor=" + sumifor);
2.do…while
语法:
do { statement; } while (expression)
do…while循环和while循环本质的差异在于,while循环体内的代码可能存在一次都不会执行,但是do…while的循环体内代码至少会执行一次。
var sumdo = 0; var i = 5; do { sumdo = sumdo + i; } while (i != 5); var sumdo2 = 0; var i2 = 5; while (i2 != 5) { sumdo2 = sumdo2 + i2; } document.write("<br/>sumdo=" + sumdo); document.write("<br/>sumdo2=" + sumdo2);
3.break和continue关键字的作用
break和continue都有跳出循环的作用,就是让代码不按照既有的顺序往下执行;
但是break是直接跳出循环,执行循环的下一条语句。
var sumifor = 0; for (var i = 1; i <= 100; i++) { document.write("<br/>======================================"); if (i <= 88) { var currentSum = sumifor; sumifor = sumifor + i; document.write("<br/>" + currentSum + " + " + i + " = " + sumifor); } else { break; } }
continue:当在循环体内出现continue关键字,则continue关键字下面的语句不会执行,但是程序会继续执行循环,不会跳出循环执行循环的下一条语句。
var sumifor = 0;for (var i = 1; i <= 100; i++) { document.write("<br/>======================================"); if (i != 88) { var currentSum = sumifor; sumifor = sumifor + i; document.write("<br/>" + currentSum + " + " + i + " = " + sumifor); } else { continue; } document.write("<br/>"+i +"++++++++++++++++++++++++++++++++");}document.write("<br/>END");
数据类型
在Javascript中,数据类型包括了数值型、布尔类型、字符型、对象、数组、还有两个比较特殊的数据类型null/undefined。
函数也是一种特殊的数据类型
在数值型的运算中,浮点类型由于涉及到不同进制的换算,所以在计算的时候会出现一些意想不到的结果。
var a1 = 0.1; var a2 = 0.3; console.log(a1 + a2); // 0.4 console.log(a2 / a1); // 2.9999999999999996
在Javascript中对象类型又可以理解为:
狭义的对象 (object)
数组(array)
函数(function)
包括数值、字符串、布尔值我们都成为基本数据类型,基本数据类型不能再细分。
在对变量进行赋值的时候,可以修改变量的数据类型,这是Javascript语言的特殊点,也是作为一种弱语言的基本特性。
var test1 = function() { console.log("hello, test1"); }; test1(); test1 = "hello"; console.log("test1 = " + test1);
typeof运算符
用于确定当前变量的值是什么数据类型
在Javascript中有3种方法确定一个值的数据类型
- typeof运算符
- instanceof运算符
- object.prototype.toString方法
console.log(typeof 123); // number console.log(typeof '123'); // string console.log(typeof true); // boolean console.log(typeof test); // function console.log(typeof undefined); // undefined console.log(typeof [1,2,3]); // object console.log(typeof {}); // object console.log(typeof null); // object
数组的类型也是object,这说明在Javascript中,数组本质上只是一种特殊的对象。
遗留的问题:null和undefined的区别;
数值类型
1.整数和浮点数
在Javascript内部,所有的数字都是以64位浮点形式存储的,即便是整数也是如此,所以,在Javascript中1 和1.0,是同一个数字。
console.log(1 === 1.0); // true
由于浮点数不是精确的值,所以在计算的时候要特别的小心。
console.log(0.1 + 0.2 === 0.3); // falseconsole.log(0.3 / 0.1); // false
遗留问题:至于浮点数为什么不能表示精确的值,自己找相关的资料。
Javascript所能表示的数值范围:
console.log(Number.MAX_VALUE); // 1.7976931348623157e+308 console.log(Number.MIN_VALUE); // 5e-324
遗留的问题:数值的表示方法,16进制、8进制、科学计数法等。
关于+0和-0的概念(在Javacript中任何一个数都有一个负值,0也不例外)
console.log(+0 === -0); // true console.log(1 / +0); // +Infinity console.log(1 / -0); // -Infinity console.log(1 / +0 === 1 / -0); // false
2. NaN(Not a Number)
主要出现在将字符串错误的解析为数字。
console.log(5 - 'x'); // NaN console.log(0 / 0); // NaN console.log(Math.sqrt(-9)); // NaN
3.与数值类型相关的几个全局方法
parseInt():把字符串解析为整数,要注意的是,字符串在解析为整数的时候,是一个个字符解析的,如果遇到不能转为数字的字符,就不再解析下去,返回已经解析完成的字符数字。
console.log(parseInt('12px')); // 12 console.log(parseInt('012')); // 12 console.log(parseInt(' 12')); // 12 console.log(parseInt('12 abc 12')); // 12
parseFloat():概念同parseInt
字符串
字符串是一个或多个排在一起的字符,可以用单引号和双引号包裹。
在单引号包裹的字符串内部可以使用双引号,同样的,在双引号包裹的字符串内部也是可以使用单引号。
console.log("hello,'world'!"); console.log('hello,"world"!');
在源代码中如果需要使用多行字符串,我们一般使用 + 或者 \ ,但是一般都是使用 + 拼接。
console.log('hello,world!' + 'hello,world!' + 'hello,world!hello,world!'); console.log('hello,world!\ hello,world!\ hello,world!hello,world!');
1.转义字符
\0 null
\b 后退键
\f 换页符
\n 换行符
\r 回车符
\t 制表符
\v 垂直制表符
\’ 单引号
\” 双引号
\ 反斜杠
console.log('\t"hello,world!"\n' + 'hello,world!\n' + 'hello,world!\n' + 'hello,world!\n');
2.转换为字符串
有两种方式转换为字符串
//几乎每个值都有toString方法,除了null和undefined var age = 11; var ageText = age.toString(); console.log(ageText+1); var found = true; var foundText = found.toString(); console.log(foundText); var value1 =10; var value2 = true; var value3 = null; var value4; //String()函数能将任何类型的 console.log(String(value1)); console.log(String(value2)); console.log(String(value3)); console.log(String(value4));
3.字符串和数组
字符串可以理解为一个特殊的字符类型的数组,因此可以使用数组的中括号返回某个索引位置的字符。但是不能通过索引位置赋值。
var h = "hello"; h[0] = "w"; // 此处不会修改h[0]的值 console.log(h); // hello h.length = 7; console.log(h.length); // 5
布尔类型
在Javascript的boolean类型中,除true和false表现真假外,0也可以表示假,非0表示真。
函数
函数是一段可以反复调用的代码块,函数区别于代码块最显著的特征就是可以有输入参数,根据不同的输入参数,可以返回不同的结果。
1. 函数的声明
函数的声明有三种方式,常用的前两种。
1)function命令
function 命令后面是函数名,函数名后面是一对圆括号,里面是传入的参数。
// 函数的声明或者叫函数的定义function p(str) { console.log(str);}// 调用函数p("abc");
2)函数表达式
用变量赋值的写法去声明一个函数。
var print = function(str) { console.log(str);};print("xxxx");
在上述代码中,在赋值预算符=右边的函数,是没有名字的,我们把这种类型的函数也称之为匿名函数,匿名函数有时我们也叫做函数表达式。
在通过函数表达式定义一个函数的时候,在语句后面要加上“;”。
3)Function构造函数
很少用这种方式定义:语义不明确,代码的可读性差。
2.第一等公民
JavaScript将函数看做一个值,与其他类型的值(数值、字符串、布尔值等)地位相同。凡是可以使用值的地方都可以使用函数,可以把函数赋值给变量或对象的属性。也可以当做参数传递给其他函数,或者作为函数的结果返回。函数只是一个可执行的值,此外并无特殊之处。
function add(x, y) { return x + y;}var add = function(x, y) { return x + y;};var oper = add;print(oper(2,2)); // 4function a(op) { return op;}print(a(add)(1,2)); // 3var o2 = { name : "Tom", add : add};print(o2.add(3,3)); // 6
3.函数名的提升
Javascript引擎将函数名视同变量名。所以采用function命令声明函数时,整个函数就会像变量声明一样,提升到代码头部。
4.函数的属性和方法
- name属性:输入函数的名字
- length属性:输入函数参数的个数
- toString()方法:返回函数的源码
print("add.name=" + add.name);print("add.length=" + add.length);print("add.toString()" + add.toString());
5.函数的作用域
作用域(scope)称之为变量存在的范围。
在Javascript中只有两种作用域,一种是全局作用域:即变量在整个程序中一直存在,所有的地方都可以读取。
另一种叫函数作用域:即变量只在函数内部存在。
var i = 0; // 这里的i是全局变量,可以在页面的任何位置引用function t() { var j = 0; console.log("j=" + j); console.log("i=" + i);}// console.log("out j = " + j); // 此处代码会报错,j is not definedt();
函数体内的变量提升
function t() { console.log("j=" + j); // j=undefined var j = 0; console.log("i=" + i);}
6.参数
函数在运行的过程中,有时需要提供外部数据,不同的外部数据可能会得到不同的结果,我们把这种外部数据叫做参数。需要特别注意的时,在Javascript语言中是不需要指定参数的数据类型的。
function p(str) { console.log(str);}
参数的省略
在javascript中,函数的参数不是必须的,Javascript可以省略。
function p(str, flag) { console.log("str=" + str); console.log("flag=" + flag);}console.log("=======================");p("hello");console.log("=======================");p("hello",true);console.log("=======================");p();console.log("=======================");
被省略的参数的值变成“undefined”;但是,没有办法只传递靠后的参数,省略靠前的参数,可以通过显示的传入undefined。
关于默认值的实现
function f(a) { a = a || 1; console.log("a:" + a);}f(); // 1
7.传递方式
函数参数如果是原始数据类型(数值、字符串、布尔型),都是传值传递,如果在函数体内修改了变量的值,不会影响到函数体外。
function f(o) { o = 5; console.log("o=" + o);}var i = "abc";f(i);console.log("i=" + i); // abc
但是,如果函数的参数是复合数据类型的值(数组、对象、函数等),传递方式是引用传递。也就是说,在函数内部修改了原对象的值,会影响到原来的值。
function fo(oj) { oj.name = "Jack"; console.log("oj.name=" + oj.name);}var obj = { name : "Tom", age :20};fo(obj);console.log("obj.name=" + obj.name); // Jack
数组
数组是按次序排列的一组值。每个值的位置都有编号(从0开始的)。整个数组用方括号表示。
数组的元素可以是不同的数据类型。
如果数组中的元素也为数组,那么就构成了一个二维数组
var arr = ['a','b','c'];var arr2 = [];arr2[0] = 'a';arr2[1] = 'b';arr2[2] = 'c';var arr3 = ['a',12,true,{name:"Tom",age:18}];console.log(typeof arr3[2]); // booleanvar arr4 = [[1,2],[3,4]];console.log(arr4[1][0]); // 3
1. 数组的本质
本质上,数组就是一个对象。通过typeof运算符返回的类型就是object。
console.log(typeof arr4); // objectconsole.log("arr['1']=" + arr['1']); // bconsole.log(Object.keys(arr)); // ["0", "1", "2"]
2.length属性
length属性返回的是数组的成员数量。
Javascript使用32位整数保存数组的元素个数,所以length的最大值为232-1。
只要是数组,就有length属性,而且length属性是一个动态的值,该值等于键名中的最大整数+1。
清空一个数组比较有效的方法就是设置length=0
var arr5 = [1,2,3,4,5];console.log(arr5.length); // 5arr5[100] = 100;console.log(arr5.length); // 11console.log(arr5[7]);var arr6 = [1,2,3,4];console.log(arr6[3]); // 4arr6.length = 3;console.log(arr6[3]);
for…in循环和遍历数组
var arr6 = ['a','b','c','d'];arr6.score = 98;for (var i in arr6) { console.log(arr6[i]); // a b c d 98}
通过for…in遍历数组的时候,会把非数字键的属性也遍历出来,所以不推荐使用for…in遍历数组
我们一般还是使用for或while循环去遍历数组
for (var i = 0; i < arr6.length; i++) { console.log("arr6[" + (i) + "]=" + arr6[i]);}var i = 0;while (i < arr6.length) { console.log("arr6[" + (i) + "]=" + arr6[i]); i = i + 1;}
- 11.09 JavaScript基础
- javaScript基础
- JAVASCRIPT 基础
- JavaScript基础
- JAVASCRIPT基础
- JavaScript 基础
- javascript基础
- javascript基础
- JavaScript 基础
- JavaScript基础
- javascript基础
- JavaScript基础
- javascript基础
- javascript基础
- Javascript基础
- JavaScript基础
- JavaScript基础
- javascript基础
- 容器网络
- 文字动态发光特效代码简单实现
- 【bzoj1042】[HAOI2008]硬币购物
- 1009. 说反话 (20)
- Ubuntu 16.04安装Java JDK8
- 11.09 JavaScript基础
- spark集群安装
- 【Cocos2d-x游戏开发】解决Cocos2d-x中文乱码的三种方法
- 记一次从阿里云的rds恢复备份数据到自建数据库
- QT之qss教程-QMenuBar
- 德国电信公司表示将出售其IT外包业务
- java基本数据类型传递与引用传递的区别详解
- 常见问题解答:什么是锁存和锁存争用(11g及以上)(文档ID 1970450.1)
- (sklearn)lasso回归linear_model.Lasso()方法