不掉发的程序员tj-优快云博客

原创 34_JavaScript之普通函数与箭头函数的区别

1.普通函数/方法中的this, 谁调用就是谁 <script> function demo() { console.log(this); } demo(); // demo() === window. demo() </script>控制台输出：2.箭头函数中的this, 是父作用域的this，不是调用者因为没有将箭头函数放到其它的函数中, 所以箭头函数属于全局作用域在JS中只有

2020-07-12 11:01:18 187

原创 33_JavaScript之定时器

在JavaScript中有两种定时器, 一种是重复执行的定时器, 一种是只执行一次的定时器1.重复执行的定时器<body> <button id="start">开始</button> <button id="close">关闭</button> <script> let start = document.querySelector("#start") let close =

2020-07-11 00:10:20 228

原创 32_JavaScript之节点、属性的增删改查

一、节点增删改查1.创建节点<body> <div> <h1>我是标题</h1> <p>我是段落</p> </div> <script> let span = document.createElement("span"); </script></body>2.添加节点注意：appendChild方法

2020-07-10 23:36:41 505

1.获取元素像getElementById、getElementsByClassName、getElementsByName、getElementsByTagName这些了解即可，现在获取元素我们统一用querySelector就好了，不需要去记那么多。querySelector只会返回根据指定选择器找到的第一个元素querySelectorAll会返回指定选择器找到的所有元素<body> <div class="father"> <form&g

2020-07-10 22:57:00 237

原创 30_JavaScript之数组高级方法

1.遍历数组方法一：for循环 <script> let arr = [1, 3, 5, 7, 9]; for (let i = 0; i < arr.length; i++) { console.log(arr[i]); } </script>方法二：利用for in循环来遍历数组（不推荐） <script> let arr = [1, 3, 5

2020-07-09 00:21:49 498

原创 29_JavaScript之对象遍历

在JavaScript中对象和数组一样是可以遍历的对象的遍历就是依次取出对象中所有的属性和方法在JS中可以通过高级for循环来遍历对象以下代码的含义: 将指定对象中所有的属性和方法的名称取出来了依次的赋值给key这个变量 for(let key in obj){} <script> class Person { constructor(name, age) { this.name = name

2020-07-08 11:11:29 151

原创 28_JavaScript之获取对象类型、instanceof关键字、isPrototypeOf属性、判断对象属性

1.获取对象类型关键词：对象.constructor.name <script> let obj = new Object(); console.log("使用typeof关键字获取的对象类型" + typeof obj); console.log("使用对象.constructor.name获取的对象类型" + obj.constructor.name); let arr = new Array();

2020-07-08 10:40:08 191

原创 27_JavaScript之类

在ES6之前，我们是通过构造函数来定义类的 <script> function Person(myName, myAge) { this.name = myName; this.age = myAge; this.say = function() { console.log("Hello World"); } }

2020-07-07 16:47:28 89

原创 26_JavaScript之继承性

在ES6继承方式有多种，但存在一些弊端，这里介绍ES6之前终极继承方式 <script> function Person(myName, myAge) { this.name = myName; this.age = myAge; } Person.prototype.say = function() { console.log(this.name, this.age

2020-07-07 14:02:32 107

原创 25_JavaScript之封装性

什么是封装?封装性就是隐藏实现细节，仅对外公开接口为什么要封装?不封装的缺点：当一个类把自己的成员变量暴露给外部的时候,那么该类就失去对属性的管理权，别人可以任意的修改你的属性 <script> function Person() { this.name = "Durant"; this.age = 35; this.say = function() { cons

2020-07-07 10:56:15 151

原创 24_JavaScript之对象三角恋关系、原型链

每个“构造函数”中都有一个默认的属性，叫prototypeprototype属性保存着一个对象，这个对象我们称之为"原型对象" <script> function Person(name, age) { this.name = name; this.age = age; } let obj1 = new Person("zs", 20); console.log(Pers.

2020-07-05 00:29:13 450

原创 23_JavaScript之构造函数以及prototype

构造函数实质就是工厂函数的简写注意点：1.构造函数的函数名称首字母必须大写2.构造函数只能通过new来调用当我们new了一个对象后会做出以下事情：1.会在构造函数中自动创建了一个对象2.会自动将刚才创建的对象赋值给this3.会在构造函数的最后自动添加return this <script> function Person(name, age) { // let obj = new Object() 系统自动添加

2020-07-04 14:39:22 256

原创 22_JavaScript之工厂函数

如果我们需要输入1000个员工的信息，总不能创建1000个员工对象吧？？此时可以使用工厂函数：所谓工厂函数，就是指这些内建函数都是类对象，当你调用他们时，实际上是创建了一个类实例。 <script> function createPerson(name, age) { let obj = new Object(); obj.name = name; obj.age = age;

2020-07-03 23:52:44 234

原创 21_创建对象的三种方式

这里以创建默认对象为例第一种方式： <script> let obj = new Object(); obj.name = "Durant"; obj.age = 30; obj.say = function() { console.log("Hello World!"); } console.log(obj.name); console.log(ob

2020-07-03 23:33:03 104

原创 20_JavaScript之箭头函数(ES6新增)

从ES6开始是这样定义函数的：let 函数名称 = (形参列表) => {需要封装的代码;} <script> let sayHi = () => { console.log("Hi"); } sayHi(); </script>控制台输出： <script> let sayHi = (name) => {

2020-07-03 18:09:46 158

原创 19_JavaScript之匿名函数

匿名函数顾名思义就是没有名字的函数应用场景：1.作为其他函数的参数 <script> function test(fn) { fn(); } test(function() { console.log("hello world"); }) </script>控制台输出：2.作为其他函数的返回值 <script>

2020-07-03 17:28:50 98

原创 18_JavaScript之函数形参返回值

当实参没有定义时，输出的值时undefined <script> function getSum(a, b) { console.log(a, b); } getSum(); </script>控制台输出：如何赋予默认值呢？在ES6之前我们可以通过逻辑或来实现格式：条件A || 条件B当A不成立时，B成立 <script> function get

2020-07-03 17:14:42 238 1

原创 17_JavaScript之arguements函数

我们平时在控制台输出的语句是 console.log( )，为什么能直接输出呢？因为log也是一个函数log函数的特点：可以接受1个或多个参数（内部实现原理用到了arguements函数）arguements的作用：保存所有传递给函数的参数注意：每个函数其实都有一个arguements arguements其实是一个伪数组 <script> function getSum() { console.log(arguments);

2020-07-03 16:35:08 828

原创 16_JavaScript之选择排序冒泡排序

1.选择排序完整代码： <script> let str = prompt("请输入任意个整数，用逗号隔开"); let arr = str.split(','); console.log("排序前：" + arr); for (let i = 0; i < arr.length; i++) { for (let j = i; j < arr.length; j++) {

2020-07-03 15:03:49 113

原创 15_JavaScript之数组的常用方法

1.如何清空数组（1）直接使得arr=[ ] <script> let arr = ["a", "b", "c"]; arr = []; console.log(arr); </script（2）让数组的长度=0 <script> let arr = ["a", "b", "c"]; arr.length = 0; console.log(arr);

2020-07-02 11:42:46 134

原创 14_JavaScript之数组的增删改查

先把总结写在前面：增的方法：在数组最前面添加数据：unshit（需要添加的数据）在数组最后面添加数据：push（需要添加的数据）在数组某一个位置添加数据：splice(位置,0，内容)删的方法：在数组最前面删除数据：shift()在数组最后面删除数据：pop()在数组某一个位置删除数据：splice(位置,个数 )改的方法：在数组某一个位置修改数据： splice(位置,个数，内容 )1.增（1）在数组最前面添加数据unshit（需要添加的数据），使用了unshit() 会将新增内

2020-07-02 11:03:06 202

原创 13_JavaScript之数组解构赋值-ES6

ES6之前我们要把一个数组赋值给某一个变量时是这样做的 <script> let arr = [1, 2, 3]; a = arr[0]; b = arr[1]; c = arr[2]; console.log("a的值为：" + a); console.log("b的值为：" + b); console.log("c的值为：" + c); </script&gt

2020-07-02 00:17:07 214

原创 12_JavaScript之数组

数组就是专门存储一组数据的注意：数组属于引用数据类型创建数组的所有方式（1）let 变量名称 = new Array(size)；创建一个指定大小的数组（2）let 变量名称 = new Array()；创建一个空（3）let 变量名称 = new Array( data1,data2,…); 创建一个带数据的（4）let 变量名称 = [ ]; 创建一个空（5）let 变量名称 = [data1,data2,… ]; 创建一个空数组（1）和其它编程语言不同，如果数

2020-07-01 23:44:43 150

原创 11_JavaScript之逻辑运算符

逻辑运算符：逻辑与：&& 逻辑或：||逻辑非：!逻辑运算符的注意点1.在逻辑运算中如果不是布尔类型,那么会先转换成布尔类型,再参与其它的运算2.在逻辑与运算中,如果参与运算的不是布尔类型,返回值有一个特点格式:条件A&&条件B如果条件A不成立,那么就返回条件A <script> let result1 = 0 && 123; console.log("result1:" + result1

2020-07-01 17:04:47 142

原创 10_JavaScript之关系运算符

关系运算符： > < >= <= == != === !===1. 对于非数值类型的数据，会先转换成数值类型，再进行判断 <script> let result1 = 1 > false; console.log("result1:" + result1); let result2 = 1 > true; console.log("result2:" + result2);

2020-07-01 14:22:55 111

原创 09_JavaScript之自增自减运算符

自增运算符 ++自减运算符 --自增和自减运算符写在变量前面和后面的区别写在变量后面，表示变量先参与其他的运算，然后再自增或自减 <script> let num = 1; let result = num++ + 1; // 实际进行的操作顺序： num + 1; num++ console.log("num:" + num); console.log("result:" + result); </scr

2020-07-01 13:39:30 131

原创 08_JavaScript之算数运算符

算数运算符： + - * / %1.加法运算的注意点（1). 任何非数值类型的数据在参与加法运算之前，都会被自动转换为数值类型后再参与运算 <script> let flag = true; let num = 100; let sum = flag + num; console.log(sum); </script>控制台输出：（2）任何数据和NaN进行运算，结果都是NaN <

2020-06-30 23:36:37 209

原创 07_JavaScript之数据类型转换

首先在复习一下JavaScript中的基本数据类型：Number 数值类型String 字符串类型Boolean 布尔类型Undefined 未定义类型NULL 空类型本篇文章将阐述类型与类型之间如何进行相互转换。1.转换为字符串类型方法一：对于Number类型和Boolean类型来说，可以通过变量名称.toString()的方式来转换。 <script> //Number类型通过变量名称.toString()的方式来转换 let nu

2020-06-30 18:46:10 168 1

原创 06_JavaScript之数据类型

数据类型分为基本数据类型和引用数据类型。检验数据类型的方法：typeof 变量名称1.基本数据类型（1）Number 数值类型在JavaScript中无论是整数或者是小数都属于数值类型 <script> let num = 100; let num2 = 3.14; console.log(typeof num); console.log(typeof num2); </script>控制台结

2020-06-30 10:59:34 79

原创 05_JavaScript之变量-ES6

在上一篇博客04_JavaScript之变量中，我写到了ES5中变量如何定义，使用。其中提到在JavaScript中如果定义了同名的变量，那么后定义的变量将覆盖先定义的变量和在老版本的标准（ES6之前）JavaScript中可以使用变量，在定义变量，并不会报错这两个注意点。由此引发出了一个问题，当程序十分庞大有几十万行代码时，我们不断地去使用之前声明的变量，有可能重复声明了相同的变量，导致程序出现bug，而在ES5中并不会报错，这使得程序员需要自己去发现错误点，大大降低了开发效率。而在ES6中，则解决了该问

2020-06-29 23:18:26 114

weixin_44543513的博客