Js基础知识总结

最新推荐文章于 2024-03-16 21:48:02 发布
最新推荐文章于 2024-03-16 21:48:02 发布
阅读量305 收藏
点赞数
分类专栏： js总结 函数总结 文章标签： JavaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41224512/article/details/85472216
版权

JavaScript总结

1.JavaScript基于对象和事件驱动，并且具有安全性能的客户端脚本语言。它的组成由三部分组成：ECMAScript、DOM、BOM；
2.Java与JavaScript是两种不同的语言，不论在概念还是设计上，Java由Sun发明，是更复杂的编程语言；ECMA-262是JavaScript标准的官方名称，它由Brendan Eich发明；

3.JavaScript的使用：

**Html中的脚本必须放在`<script></script>`之间。** 
<1>:<script  type=“text/JavaScript”></script>；
<2>:<script  src="hello.js"></script>；
<3>:<input  type="text"  id="btu"  onclick="alert(Hello)"  />

补充：
JavaScript输出：
JavaScript么有任何打印或输出的函数，但是可以通过不同的方法来输出数据：
①使用window.alert() 弹出警告框
②使用document.write()方法将内容写到HTML文档中
③使用innerHTML写入到HTML元素
④使用console.log()写入到浏览器的控制台

  1. <head>与<body>中的JavaScript：

可在Html文档中放入不限数量的脚本；脚本可以位于<body>或者<head>中，或者同时存在于两部分中。
JavaScript尽量在底部写，防止获取不到页面上的元素。

  1. 变量的声明和定义

var a=10；（var表示关键字；a表示变量名；“=”表示赋值符号；）
变量的命名规则：1>.变量是由数字、字母、下划先(_)、和"$"的一种或者几种组成，且不能以数字开头，严格区分大小写。2>.当变量赋的值为数值时，不要使用双引号“”，若用引号包围值，则该值会被作为文本来处理。3>.一条语句，多个变量，该语句用var开头，并使用逗号隔开变量。
var name=“jhon”，age=20，job=“CEO”； 声明也可以跨行： var name=“jhon”， age=20， job=“CEO”；
关键字：ＥＣＭＡscript描述了一组特定用途的关键字，不能用作变量名，例如：if、else、do、while、for、in等。

6.Javascript数据类型：Number、Boolean、string、undefined、null、对象、数组。

JavaScript对象:对象有花括号{ }分隔，在括号内部，对象的属性以名称和数值对的形式来定义，属性由逗号分隔。var person={name=”bill“，lastname=”Gates“，id=5566}

7.undefined和null：

undefined 这个值表示不含有值，可通过将变量的值设为null来清空变量.(当声明了一个变量，但未对其赋值时，其数据类型为undefined)var un；alert（un）；//undefined

8.对字符串和数字进行加法运算：

若将数字和字符串相加，结果将成为字符串。

9.检查数据类型的方式：typeof

typeof null //object
typeof Array //object
typeof new Date //object
typeof NaN //Number

10.parseInt与parseFloat：

parseInt() 解析一个字符串，返回一个整数；
parseFloat() 解析一个字符串，返回一个浮点数（整数部分+小数部分）；

11，将布尔值转换为数字：

Number（false） //返回0
Number（true） //返回1

12.分支结构

if（条件）{
循环体（需要执行的代码）
}

if（条件）{
循环体（需要执行的代码）
}else{
条件不满足时，需要执行的代码
}

if（条件）{
}else if（条件）{

}else if（条件）{

}
else{
}

switch（n）{
case 1:
执行代码块1
break；
case 2:
执行代码块1
break；
default：
n与case1和case2不同时执行的代码
}

13.循环结构：

循环：重复执行同一条代码。得到相同或者不同的结果。

for（语句1，语句2，语句3）{
被执行的代码块
}
语句1：（代码块）开始前执行《可为多个值》；语句2：循环条件；语句3：增加初始变量的值的增量(在循环代码块已被执行之后执行)

while（条件）{
需要执行的代码
}

do/while：是while的循环变体，该循环会在检查条件是否为真之前执行一次代码块，然后若条件为真，就会重复这个循环。
语法：
do
{
需要执行的代码块
}
while(条件）；
注：不论条件是否为真，循环至少执行一次。

死循环：
1.循环条件永远不成立；
for（var i=10；i<10; i++）{
console.log(“A”);
}
2.循环条件一直成立
for（var i=10；i>0; i++）{
console.log(“A”);
}

break与continue：
break用于跳出循环（结束整个循环），continue用于跳出循环中的一个迭代（结束本次循环）；

14.函数：由事件驱动或者被调用时可重复执行的代码块。

优点：减少代码冗余，增强其灵活性…
基本语法：
<1> function functionname(){函数体 }
<2> var 函数名=function(){函数体 }
<3> var 函数名=new Function(){函数体 }
函数的执行有两种：1>事件驱动；2>调用；

函数的参数:

形参：在定义函数时，小括号里放的变量；
实参：在函数调用时，小括号里放到变量或值；
注意：实参与形参一 一 对应；有实参无形参，实参利用不上；有形参无实参，形参取undefined；

arguments：取到所有实参的集合，这个集合是一个类数组对象（伪对象）

return：函数的返回值，结束函数执行。

若一个函数没有显示写出return或者return后没有具体的值，console.log（foo（））；//均为undefined

函数的作用域：变量或者函数起作用的范围（区域）——>能被访问到的区域

全局作用域：最外层函数和最外层函数通过var来定义的变量
局部作用域：变量在函数内声明，变量为局部作用域，只能在函数内部进行访问
js变量声明周期：在它声明时初始化
1.局部变量在函数执行完毕时初始化
2.全局变量在页面关闭后销毁

递归函数：函数可以调用自身（在一个函数内部调用自身），函数自己在执行过程中，调用自己本身。（原理：自己调用自己，从后往前倒推）

利用递归 f（n）求前n项和

		function num(n){
				if(n==1){
				return 1;
			}
				if(n==2){
				return 3;
			}
			return num(n-1)+n;
		}
		console.log(num(100)); //5050

补充：“随机数生成器（0-1之间）：Math.random();”

alert与return区别：(两者结果相同)
1>.

function Sum(a,b)                     
    {
         return a+b;
    }
    var c = Sum(10,5);
    alert(c);

2>.

function Sum(a,b)
    {

         alert(a+b);
    }

日期时间函数（需要用变量调用）：

var a = new Date(); //获取当前时间
a.getTime() //获取时间戳
a.getFullYear() //获取年份
a.getMonth()+1; //获取月份
a.getDate() //获取天
a.getHours() //获取小时
a.getMinutes() //获取分钟
a.getSeconds() //获取秒数
a.getDay() //获取星期几
a.getMilliseconds() //获取毫秒

数学函数（用Math来调用）: >>eg： alert（Math.abs(-2)）

abs(x)     //返回数的绝对值
ceil(x)     //对小数进行上舍入
floor(x)   //对数进行下舍入
round(x)  //把数四舍五入为最接近的整数
max(x,y) //返回 x 和 y 中的最高值
min(x,y)  //返回 x 和 y 中的最低值
pow(x,y) //返回 x 的 y 次幂
sqrt(x)    //返回数的平方根
random() //返回 0 ~ 1 之间的随机数

字符串函数（用变量来调用）

eg：
var a="ssdlld";
var index1 = a. indexOf("l");
alert(index1);

15.数组：所谓数组，是有序的元素序列（一组有序数据）；

注：一般来说，数组中的元素类型相同。
表现形式就是内存中的一段连续的内存地址

数组的创建

1，字面量
var arr = [1, 2];//数组中有两个元素
arr.length ;//获取数组的长度
arr[i]获取数组中的第i个元素，i称为数组的下标或者索引，下标从0开始
arr[0]//获取数组中的第一个元素
arr[0] = 100;//修改数组中第一个元素的值为100

2，构造函数方式创建数组
Array是一个构造函数，可以用它生成新的数组
var arr = new Array(2);
arr.length // 2
arr[0]//undefined
上面代码中，Array构造函数的参数2，表示生成一个两个成员的数组。
Array构造函数有一个很大的缺陷，就是不同的参数，会导致它的行为不一致。
// 单个非数值（比如字符串、布尔值、对象等）作为参数，
// 则该参数是返回的新数组的成员
new Array(‘abc’) // [‘abc’]
// 多参数时，所有参数都是返回的新数组的成员
new Array(1, 2) // [1, 2]
new Array(‘a’, ‘b’, ‘c’) // [‘a’, ‘b’, ‘c’]
可以看到，Array作为构造函数，行为很不一致。因此，不建议使用它生成新数组，直接使用数组字面量是更好的做法。

数组的方法

1.push

push方法用于在数组的末端添加一个或者多个元素，并返回添加新元素后的数组长度。

var  arr=[  ];
arr.push(1);//1
arr.push('a'); //2
arr.push(true,{ }); //4
arr      //[1,'a',true,{}]

2.unshift

unshift方法用于在数组的第一个位置添加元素，并返回添加新元素后的数组长度。注意：该方法会改变原数组。

var a=['a','b','c'];
a.unshift('x');  //4
a  //['x','a','b','c']

3.shift

shift方法用于删除数组的第一个元素，并返回该元素。注意：该方法会改变原数组。

var a=['a','b','c'];
a.shift()  //'a'
a //['b','c']

4.pop

方法用于删除数组的最后一个元素，并返回该元素。注意：该方法会改变原数组。

var a=['a','b','c'];
arr.pop(); //'c'
arr   //['a','c']
对空数组使用pop方法，不会报错，而是返回undefined。

5.slice

slice方法用于提取目标数组的一部分，返回一个新数组，原数组不变。
arr.slice(strat,end)
它的第一个参数为起始位置（从0开始），第二个参数为终止位置（但该元素本身不包括在内），如果省略第二个参数，则一直返回到原数组的最后一个成员。

var a=['a','b','c'];

a.slice(0);  //['a','b','c']
a.slice(1);  //['b','c']
a.slice(1,2）；//['b']
a.slice(2,6);  //['c']

a.slice();  //['a','b','c']
上面代码中，最后一个例子slice没有参数，实际上就等于返回一个原数组的拷贝。

注意：
如果slice方法的参数是负数，则表示倒数计算是位置。
var a = [‘a’, ‘b’, ‘c’];
a.slice(-2) // [“b”, “c”]
a.slice(-2, -1) // [“b”]
上面代码中，-2表示倒数计算的第二个位置，-1表示倒数计算的第一个位置。
如果第一个参数大于等于数组长度，或者第二个参数小于第一个参数，则返回空数组。
var a = [‘a’, ‘b’, ‘c’];
a.slice(4) // []
a.slice(2, 1) // []

数组的操作：

reverse/sort:

reverse方法用于颠倒排列数组元素，返回改变后的数组（还是原数组），注意，该方法会改变原数组。
var a=[‘a’,‘b’,‘c’];

a,reverse() //[‘c’,‘b’,‘a’]
a //[‘c’,‘b’,‘a’]

sort方法对数组成员进行排序，默认是按照字典顺序排序，排序后，原数组将被改变。
['d',c','b','a'].sort() //['a','b','c','d']

['4',3','2','1'].sort()
//['1','2','3','4']

[11,101].sort();
//[101,11](注意：sort方法不是按照大小排序，而是按照字典顺序，也就是说，数值会被先转换成字符，在按照字典顺序进行比较，所以101排在11前面)

例：可以将数组从小到大或者从大到小排序
var arr=[2,9,6,55,11,8,99];
arr.sort(function(){
	return a-b;   //小-----大
	//return  b-a;  //大-----小
});
console.log(arr);

join方法: 以指定参数作为分隔符，将所有数组成员连接为以字符串返回，若不提供参数，默认用逗号 ， 分隔；
如果数组成员为undefined或者null或者空位，全会被转换成空字符串；

concat方法： 将参数放入原数组后返回，原数组本身不变，若参数是数组，将值提出来；

var arr=[1,2,3];
var a=arr.concat([4,5,6]);
console.log(a);//[1,2,3,4,5,6]
console.log(arr);//[1,2,3]

ES5 && string

1.严格模式：采用更加严格的JavaScript语法；
设计目的：①明确禁止一些不合理，不严谨的语法，减少JavaScript语言的一些怪异行为；②增加更多报错的场合，消除代码运行的一些不安全之处，保证代码运行的安全；③提高编译器效率，增加运行速度；④为未来新版本的JavaScript语法做铺垫；
启用方法： 进入严格模式的标志，是一行字符串 “use strict”，也可以不在第一行，比如在注释或者跟在第一个空的分号后面；
2.ES5新增数组的方法：
①indexof（）通常判断一个数组中有没有某个元素
②map 将数组的所有成员依次传入参数函数，然后把每一次的执行结果组成一个新数组返回；
③forEach 也是对所有数组成员依次执行参数函数，但是foreach方法不返回值，只用来操作数据；
④filter() 用于过滤数组成员，满足条件的成员组成一个新数组返回；
⑤some（）、every（）
⑥reduce（）依次处理数组的每个成员，最终累计为一个值

Event
1.获取事件源：
var _target=e.target || e.srcElement;
2. 阻止事件冒泡的方式：
①e.stopPropagation();②e.cancelBubble=true（兼容IE）；
3. 阻止浏览器默认行为方式：
①e.preventDefault();----> w3c
②returnValue=false；-----> ie
③return false；
4.通过判断键码确定用户按下那个键：
event.keyCode || event.which(老IE不支持)
5.监听器的添加和移除：
添加：
①ele.addEventListener（“click”，fn，false）—事件前不加on；
②IE8及以下 attachEvent（on+事件名，fn）
移除：
①ele.removeEventListener（“click”，fn，false）—事件前不加on；
②IE8及以下 detachEvent（on+事件名，fn）

浏览器兼容性问题

  1. 在获取DOM节点时高版本浏览器和低版本浏览器之间存在兼容问题；在高版本的浏览器中只是获取节点，会忽略文本内容，而在低版本的浏览器中在获取节点时会包含文本节点；

  2. 事件对象：在IE浏览器中事件对象是window对象的一个属性event，并事件对象只能在事件发生时被访问，所有事件处理完后，该对象就消失了。在标准的DOM中规定事件处理函数的第一个参数为事件对象；

  3. 在IE中，事件的对象包含在event的srcElement属性中，在标准的DOM浏览器中，对象包含在target属性中

  4. 在IE中取消事件传递（阻止冒泡）的方法为：window.event.cancelBubble=true;在非IE中取消事件传递（停止捕捉）的方法为stopPropagation();

  5. 获取style CSS内联样式属性值
    //var w = window.getComputedStyle(box,null).width; //标准
    //var h = box.currentStyle[“height”]; //IE8及以下的处理方式
    function getStyle(dom,propertyName){
    if(dom.currentStyle){
    return dom.currentStyle[propertyName];
    }else{
    return getComputedStyle(dom,null)[propertyName];
    }
    }

  6. 事件监听
    标准: addElementListener(“click”,function(){},false);
    IE：attachEvent(“onclick”,function(){});
    function addEvent(dom,type,fn){
    if(dom.addEventListener){
    dom.addEventListener(type,fn);
    }else{
    dom.attachEvent(“on” + type,fn);
    }
    }

offsetLeft和style.left、offsetWidth和style.width的区别：

offsetLeft:是获取节点对象相对于父元素的左侧的距离，只读属性 返回值不包含px单位
style.left：获取的是css样式的属性，返回的属性值有px单位
offsetWidth：获取一个节点对象的宽度
style.width：获取的是css样式的属性，返回的属性值有px单位

常见的几种获取DOM元素的方法以及兼容：

1． 获取第一个子节点：firstElementChild||firstChild;
2． 获取最后一个子节点：lastElementChild||lastChild;
3． 获取所有的子节点：childNode(包含文本节点)；children（获取所有子节点，不包含文本节点）根据需要自己选择；
4． 获取兄弟节点的上一个子节点：previousElementSibling||previousSibling;
5． 获取兄弟节点的下一个子节点：nextElementSibling||nextSibling;
6． 获取父节点：parentNode;

fengGer的bugs
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Python使用cx_Oracle模块操作Oracle数据库详解
09-09
主要介绍了Python使用cx_Oracle模块操作Oracle数据库,结合实例形式较为详细的分析了cx_Oracle模块的下载、安装及针对Oracle数据库的连接、执行SQL语句、存储过程等相关操作技巧,需要的朋友可以参考下
cx_Oracle使用方法
热门推荐
weixin_42769040的博客
08-13 2万+
第一步：导入cx_Oracle ，建立连接 复制代码 import cx_Oracle # 导入模块 db = cx_Oracle.connect(‘hr’, ‘hrpwd’, ‘localhost:1521/XE’) #建立连接，3 个参数分开写 db1 = cx_Oracle.connect(‘hr/hrpwd@loca...
Python 连接 Oracle 并实现增删改查（cx_Oracle）
鱼丸丶粗面
09-07 2061
Python 连接 Oracle 并实现增删改查（cx_Oracle）
python之cx_Oracle实现本地exe连接oracle数据库执行命令
qq_43604110的博客
04-28 292
python之cx_Oracle实现本地exe连接oracle数据库执行命令
python操作cx_oracle
qq_73420934的博客
01-04 1359
python操作cx_oracle
JavaScript基础知识总结.xmind
02-23
通过思维导图的方式，快速了解掌握JavaScript的基本内容
node.js基础知识汇总
10-14
主要介绍了node.js基础知识，帮助大家更好的理解和学习node.js，感兴趣的朋友可以了解下
javascript知识点总结（1）
07-23
本文包括JavaScript的部分基础知识的总结
JavaScript所涵盖知识点超详细汇总.xmind
04-08
超详细JavaScript知识点梳理总结树，大纲清晰明确，涵盖所有JS基础知识点，范围广且详细，超适合前端小白基础入门，你值得拥有！
JavaScript基础知识点汇总（代码+知识点）
09-22
采用xmind框图导出，特别直观清晰的将javascript的知识点总结了一遍！从基本的变量到函数、对象、事件等等总结的十分全面。
【Python Oracle】使用cx_Oracle 连接oracle的简单介绍
cojm55771的博客
11-23 349
连接数据库的几种方式：语法：cx_Oracle.connect('username','pwd','IP/HOSTNAME:PORT/TNSNAME')import cx_Oracledb1=cx_Oracle.connect(...
python连接oracle的几种方式
lixiaomei0623的专栏
11-03 5149
'tp','tp','10.20.36.19:1521/ocntest' oracle服务器的部署信息： IP：10.20.36.19 端口：1521 服务名：ocntest 用户名：tp 密码：tp 1.基本连接–使用Oracle tns alias connection = cx_Oracle.connect("tp/tp@ocn_test") #查看tns alias命令 cmd>tnsping ocn_test TNS Ping Utility for Linux: Version
cx_Oracle连接本地数据库
最新发布
m0_75101340的博客
03-16 150
cx_Oracle连接本地数据库
Python安装cx_oracle操作
qq_73428784的博客
12-05 6406
Python安装cx_oracle操作
实战经验分享，Python 连接 Oracle 踩坑实录
伤心的辣条
02-02 640
最近的一个测试任务需要测试 oracle 同步 hive 数据库的性能，那就需要对 oracle 数据库灌注测试数据。我就又打开了我的IDE，准备把我之前一下可以灌50w数据到 MySQL 的代码，改一改，直接用。因为我在网上看到，语法上也差不多，基本上没有区别。于是，我先打开了 windows 的 cmd 模式，输入：pip install cx_Oracle 下载好连接数据库的第三方包。当然也可以通过 python 第三方库官网（https://pypi.org/）下载相应版本的文件后自行安装。
【Python】Python 连接 Oracle 数据库-cx_Oracle
As before 如初
06-02 695
前言   最近在用Python写一个项目，需要用数据库记录用户信息，正好自己的本命语言是Oracle，便研究了下Python如何连接Oracle数据库。记录一哈，以备下次之需，欢迎指正。 环境 项目是用MiniConda搭建的虚拟集成环境 Python版本 用到的库 cx_Oracle Oracle版本 步骤 第一步：安装cx_Oracle 命令 pip install cx_Oracle 提示Successfully installed cx-Oracle-8.2.0为安装成功 第二步：连接数据
SQL高级教程,用于python中的cx_Oracle（自己的笔记，内附原教程
qq_43548010的博客
09-01 368
后面发现SQL语句其实不是很难，一天就能上手。(小白表示不相信++ SQL高级教程 TOP 语法：select top 2 * from table_name -> 选取头两行 select top 50 percent* from table 从头开始取百分之五十的数据 LIKE 语法：select col_name 大佬指导书—>戳一戳 ...
el表达式 换行符的问题
苦逼的老王的博客
01-31 4019
在js中使用el表达式时如果字符串包含了换行符会导致js直接报错，在html不会报错但是字符串不会换行。 报错js var content=“${versionInfo.logContent}"; //文本中有换行符直接报错 var content=‘${versionInfo.logContent}';//文本中有换行符直接报错 不报错js varcontent=`${versionI
node.js基础知识
07-28
Node.js的基础知识包括了如何执行另一个模块中的功能。例如，在一个模块中使用require函数引入另一个模块，然后可以调用该模块中的功能。例如，如果有一个b.js模块和一个first.js模块，可以在first.js模块中使用...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值