JavaScrips是一门世界上最流行的脚本语言。 一个合格的后端人员，必须精通javaScript ECMAScript可以理解为是JavaScript的一个标准。 最新版本已经到es6版本 但是大部分浏览器还只停留在支持es5代码上。 开发环境-线上环境，版本不一致。 浏览器调试： 控制台打印： 数值、文本、图形、音频、视频 js不区分小数和整数，Number 1、正常字符串我们使用 单引号、双引号 2、转义字符 3、多行字符串编写 4、模板字符串 5、字符串长度 6、字符串的可变性，不可变。 7、大小写转换 8、msg.indexOf(“y”); 返回字符在字符串当中的位置 9、substring true 、false 这是一个JS的缺陷，坚持不要使用 == 比较 须知： 浮点数问题：尽量避免使用浮点数进行计算，存在精度问题。 若干键值对 JS中对象，{…}表示一个对象，键值对描述属性：xxx：xxx，每个属性之间使用逗号隔开，最后一个属性不加逗号。 对象是大括号，数组是中括号。 JavaScript中的所有的键都是字符串，值都是任意对象 1、对象赋值 2、使用一个不存在的对象属性，不会报错！undefined 3、动态的删减属性 4、动态的添加，直接给新的属性添加值即可 5、判断一个属性值是否在这个对象中。 6、判断一个属性是否是这个对象自身拥有的hasOwnProperty() Array可以包含任意的数据类型。 1、长度 注意：加入给arr.length赋值，数组大小就会发生变化，如果赋值过小，元素就会丢失。 2、indexOf，通过元素获得下标索引 字符串的”1″ 和数字1 是不同的。 3、slice()截取Array的一部分，返回一个新的数组，类似于String中的substring 4、push()，pop() 头部 5、unshift()、shitf()头部 6、排序 sort() 7、元素反转 reverse() 8、concat() 注意：concat（）并没有修改数组，只是会返回一个新的数组。 9、连接join 打印拼接数组，使用特定的字符串连接。 10、多维数组 数组：存储元素（如何存，如何取）。 while循环，避免程序死循环。 for循环 forEach循环（函数）es5特性 for…in（下标索引） ES6的新特性 无序不重复的集合 es6新特性 使用iterator来遍历迭代我们Map、Set 遍历数组： 遍历Map： 遍历Set 定义方式一 绝对值函数 一旦执行到return 代表函数结束，返回结果。 如果没有执行return ，函数执行完也会返回结果，结果就是undefined。 定义方式二 function(x){…}这是一个匿名函数，但是可以把结果赋值给abs。 方式一和方式二等价！ 调用函数 参数问题：JavaScript可以传任意个参数，也可以不传递参数。 参数进来是否存在问题？ 假设不存在参数，如何规避？ arguments 代表，传递进来的所有的参数，是一个数组。 问题：arguments包含所有的参数，我们有时候想使用多余的参数来进行附加操作。需要排除已有参数。 rest 以前： ES6引用的新特性，获取处理已定义的参数之外的所有的参数： rest参数只能写在最后面，必须用…标识。 在JavaScript中，var定义变量实际是有作用域的。、 假设在函数体中声明，则在函数体外不可以使用（非要想实现的话，后面可以研究一下（闭包）） 如果两个函数使用了相同的变量名，只要在函数内部，就不冲突。 内部函数可以访问外部函数的成员，反之不行。 假设，内部函数变量和外部函数的变量，重名！ 提高变量的作用 结果：xundefined 说明：js执行了引擎，自动提升了y的声明做用域。 这个是放在JavaScript建立之初就存在的特性。 养成规范：所以的变量定义都放在函数的头部，不要乱放，便于维护。 全局变量 全局对象Window alert()这个函数本身也是一个 JavaScript实际上只有一个全局变量作用域，任何变量（函数也可以视为变量），假设没有在函数作用范围内找到，就会向外查找。如果在全局作用域都没有找到，报错 规范 由于我们所有的全局变量都会绑定到我们的window上，如果不同的js文件，使用了相同的全局变量，冲突，如何能够减少冲突。 把自己的代码全部放入自己定义的唯一空间名字中，降低全局命名冲突的问题。 jQuery（$.） 局部作用域 let ES6 let 关键字，解决局部作用域冲突问题。 建议大家都是用’let’去定义局部作用域的变量。 常量 const 在ES6 之前，怎么定义常量：只有全部大写字母的变量就是常量，建议不要修改这样的值 在ES6引入了常量关键字 定义方法 方法就是把函数放在对象里面，对象只有两个东西：属性与方法。 将方法分开： this是无法指向的，是默认指向调用它的那个对象。 apply 在js中可以控制this指向！ 标准对象 转换 json是什么 早期，所有数据传输习惯用XML文件。 在JavaScript一切皆为对象，任何JS支持的类型都可以用JSON来表示：number，string… 格式： JSON字符串和JS对象的转换。 JSON与JS对象的区别： JavaScript、java、c#面向对象；JavaScript有些区别 原型 class 继承 1、定义一个类，属性，方法 本质：查看对象原型。
1、JavaScrip
2、历史
3、快速入门
3.1、引入JavaScript
内部标签
<script> alert("1"); </script> 外部引入
<script src="js.js"></script> 3.2、基本语法入门
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> // 1.定义变量 变量类型 变量名 = 变量值 var score = 78; alert(score); // 2. 条件控制 if (score > 70){ alert(">70"); } //console.log(score); 在浏览器的控制台打印变量 </script> </head> <body> </body> </html> 
4、数据类型
4.1、number
123 //整数 123.1 //浮点数123.1 1.123e3 //科学计数法 -99 //复数 NaN //not a number Infinity //表示无限大 4.2、字符串
' n t u4e2d u### Unicode字符串 x41 Ascll字符 <script> 'use strict'; var msg = `hello worlf youyuan` </script> <script> 'use strict'; //Tab 上面，Esc下面 let name = "youyuan"; let age = 23; let msg = `hello,${name}`; alert(msg) <script> console.log(msg.length) //调用方法 msg = msg.toUpperCase() alert(msg); msg = msg.toLowerCase(); alert(msg); msg.substring(0) msg.substring(1) //从第一个字符串截取到最后一个字符串 msg.substring(1,9) //[1,9) 4.3、布尔值
4.3、逻辑运算
&& //两个都为真，结果为真 || //一个都为真，结果为真 ! //真即假，假即真 4.4、比较运算
= == //等于（类型不一样，值一样，也会判断为true） === //绝对等于（类型一样，值一样，结果为true）
console.log((1/3)===(1-2/3)); Math.abs((1/3)===(1-2/3))<0.000000001 4.5、null和undefined
4.6、对象
var 对象名 = { 属性名：属性值， 属性名：属性值， 属性名：属性值 } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> var arr = [1,2,3,4,5,"a",null,true]; var person = { name:'zs', age:3, hobby:["12",23] } </script> </head> <body> </body> </html> person.name='ls' person.age12 undefined delete person.age person.hbooy="ping-ping" 'age' in person true //继承 'toString' in person true person.hasOwnProperty('age') true person.hasOwnProperty('toString') false 4.7、严格检查模式strict
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-- 'use strict'; 严格检查模式，预防JavaScript的随意性导致产生的一些问题 必须写在JavaScript的第一行 局部变量建议都使用let去定义--> <script> 'use strict'; let i = 1; </script> </head> <body> </body> </html> 4.8、数组
var arr = [1,2,3,45,6] arr[0] arr arr.length arr.indexOf(2) 1 arr.slice(0,3) push：压入到尾部 pop：弹出头部的一个元素 unshift：压入到头部 shift：弹出头部的一个元素 arr.sort() arr.reverse() rr.concat([1,67]) [4590, 456, 2, 1, 1, 0, 1, 67] arr.join("_") arr = [[1,2],[3,4]] arr[1][1] 5、流程控制
5.1、if判断
<script> 'use strict'; let age = 23; if(age > 50){ alert("50") }else if(age > 22){ alert(">22"); }else { alert("else .."); } </script> 5.2、while
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script> 'use strict'; let age = 23; while (age < 100){ age = age + 2; } alert(age) do { age = age + 3; }while (age < 200) alert(age); </script> </head> <body> </body> </html> var age = [12,34,56,34]; for (let i = 0; i < age.length; i++) { console.log(age[i]); } age.forEach(function (value) { console.log(value) }) for(var num in age){ if (age.hasOwnProperty(num)){ console.log("存在"); console.log(num) console.log(age[num]); } } 5.3 、Map 和 Set
5.3.1、Map
<script> 'use strict'; var map = new Map([['zs',100],['ls',90],['ww',120]]); let zs = map.get(`zs`); //获取value let youyuan = map.set('youyuan',23); //新增或修改 map.delete("ww"); </script> 5.3.2、Set
var set = new Set([4,5,1,78,0,0]); set.add(1); //添加 set.add(100); set.delete(78); //删除 set.has(1); //是否包含某个元素 5.4、Iterator
var arr = [3,5,7]; for (var x of arr){ console.log(x); } var map = new Map([['zs',100],['ls',90],['ww',120]]); for (let x of map){ console.log(x); } var set = new Set([4,5,1,78,0,0]); for(let x of set){ console.log(x); } 6、函数
6.1、定义函数
function abs(x){ if(x>=0){ return x; }else{ return -x; } } var asb = function abs(x){ if(x>=0){ return x; }else{ return -x; } } abs(10) //10 abs(-10) //10 var abs = function abs(x){ if (typeof x != 'number'){ throw 'Not a Number'; } if(x>=0){ return x; }else{ return -x; } } arguments是一个JS免费赠送的关键字;for (let i = 0; i < arguments.length; i++) { console.log(arguments[i]); } if (arguments.length == 2){ }else if(arguments.length == 3){ } function aaa(a,b,c,...rest) { console.log("a="+a); console.log("b="+b); console.log("c="+c); console.log(rest) } 
6.2、变量的作用域
<script> function f() { var x = 1; x = x + 1; } x = x + 2; </script> 
<script> function f1() { var x = 1; x = x + 1; } function f2() { var x = 1; x = x + 1; } </script> <script> var x = 1; function f3() { var y = x + 1; console.log(y); //2 } f3(); var z = y + 1; // Uncaught ReferenceError: y is not defined </script> <script> var x = 1; function f() { var x = 'A'; console.log('inner'+x); //innerA } console.log('outer'+x); //outer1 f(); </script> 
假设在javaScript中函数查找变量从自生函数开始，有内向外查找，假设外部存在这个同名的函数变量，则内部函数会屏蔽外部函数的变量。<script> function f() { var x = "x" + y; console.log(x); //xundefined var y = 'y'; } f(); </script> function f() { var y; var x = "x" + y; console.log(x); y = 'y'; } function f() { //var x ,y,z.....; //之后随便用 } //全局变量 x = 1 function f(){ console.log(x); } f(); console.log(x); <script> var x = 'xxx'; alert(x); alert(window.x); //默认所有的全局变量，都会自动定位在window对象上 </script> window函数<script> var x = 'xxx',old_alert; alert(x); alert(window.x); //默认所有的全局变量，都会自动定位在window对象上 old_alert = window.alert ; window.alert = function () { }; window.alert(123); //失效 window.alert = old_alert;//恢复 window.alert(124); </script> RefrenceError。//唯一全局变量 var youyuan = {}; //定义全局变量 youyuan.name = 'you'; youyuan.add = function(a,b){ return a + b; } function f() { for (var i = 0; i < 100; i++) { console.log(i); } console.log(i+1); } f(); function f() { for (let i = 0; i < 100; i++) { console.log(i); } console.log(i+1); } f(); var PI = 3.14; console.log(PI); PI = '12'; console.log(PI); constconst PI = 3.14; console.log(PI); 6.3、方法的定义与调用
var youyuan = { name:'youyuan', birth:2001, age:function () { var now = new Date().getFullYear(); return now - this.birth; } } //属性 youyuan.name //方法，一定要带括号 youyuan.age() function getAge() { var now = new Date().getFullYear(); return now - this.birth; } var youyuan = { name:'youyuan', birth:2001, age:getAge } //youyuan.age() //getAge() NAN function getAge() { var now = new Date().getFullYear(); return now - this.birth; } var youyuan = { name:'youyuan', birth:2001, age:getAge } getAge.apply(youyuan,[]);//this，指向了youyuan 7、内部对象
typeof 123 "number" typeof '123' "string" typeof true "boolean" typeof NaN "number" typeof [] "object" typeof {} "object" typeof undefined "undefined" 7.1、Date
var date = new Date(); date.getFullYear(); //年 date.getMonth(); //月 0~11 date.getData(); //日 date.getDay(); //星期几 date.getHours(); //时 date.getMinutes(); //分 date.getSeconds(); //秒 date.getTime(); //时间戳 now = new Date(1592006368511) Sat Jun 13 2020 07:59:28 GMT+0800 (中国标准时间) now.toLocaleString() "2020/6/13 上午7:59:28" now.toGMTString() "Fri, 12 Jun 2020 23:59:28 GMT" 7.2、JSON
var user = { name:'zs', age:23, sex:'男' } //对象转化为json字符串 var jsonUser = JSON.stringify(user); //json字符串转化为对象 var obj = JSON.parse(jsonUser); jsonUser "{"name":"zs","age":23,"sex":"男"}" obj {name: "zs", age: 23, sex: "男"} var obj = {name: "zs", age: 23, sex: "男"}; var json = "{"name":"zs","age":23,"sex":"男"}" 7.3 、Ajax
8. 面向对象编程
var user = { name:'zs', age:23, sex:'男' } var student = { name:'xiaoming' } //原型对象 student._proto_ = user; class关键字，是在ES6引入的class Student{ constructor(name) { this.name = name; } hello(){ alert("hello"); } } var zs = new Student("zs"); //继承 class xiaoStudent extends Student{ constructor(name,grade) { super(name); this.grade = grade; } myGrade(){ alert("我是小学生"); } } var xs = new xiaoStudent("zs",6);
本网页所有视频内容由 imoviebox边看边下-网页视频下载, iurlBox网页地址收藏管理器 下载并得到。
ImovieBox网页视频下载器 下载地址: ImovieBox网页视频下载器-最新版本下载
本文章由: imapbox邮箱云存储,邮箱网盘,ImageBox 图片批量下载器,网页图片批量下载专家,网页图片批量下载器,获取到文章图片,imoviebox网页视频批量下载器,下载视频内容,为您提供.
阅读和此文章类似的: 全球云计算
官方软件产品操作指南 (170)
75