写代码啦
《JS 对象分类,数组,函数学习笔记》
回复数(0) 浏览数(72)
{{topic.upvote_count || 0}} 编辑 回复

new X()自动做的四件事:

  • 自动创建空对象
  • 自动为空对象关联原型,原型的地址指定为X.prototype
  • 自动将空对象作为this关键字运行构造函数
  • 自动 return this
    ————JS之父的爱?

构造函数X

X本身负责给对象本身添加属性
X.prototype对象负责保存对象的共有属性

代码规范

  • 所有构造函数(专门用于创造对象的函数)首字母大写
  • 所有被构造出来的对象首字母小写
  • new后面的函数使用名词形式(如new Person(),new Object()),其它函数一般用动词开头

原型公式

对象.__proto__===其构造函数.prototype

类 vs 类型

  • 类是针对于对象的分类,有无数种类
  • 类型是JS数据的分类,有7种:四基两空一对象

爸爸在哪?

  • window的爸爸是Window
    可通过constructor属性看出构造者
  • window.Object的爸爸是window.Function
    因为所有函数都是window.Function构造的
  • window.Function的爸爸是window.Function
    浏览器构造了Function然后指定它为自己的构造者

class vs 原型

ES6引入了新语法class
原型和类都是用来给对象分类的,两种写法都需要掌握

构造函数写法如下:

function Person(name,age){
this.name=name;
this.age=age;
}
Person.prototype.sayHi=function(){
console.log("你好,我叫"+person.name)
}
let person = new Person('frank', 18)
person.name === 'frank' // true
person.age === 18 // true
person.sayHi() // 打印出「你好,我叫 frank」

class写法如下:

class Person {
constructor(name,age){
this.name=name;
this.age=age;
}
sayHi() {
console.log("你好,我叫"+person.name)
}
}
let person = new Person('frank', 18)
person.name === 'frank' // true
person.age === 18 // true
person.sayHi() // 打印出「你好,我叫 frank」

数组对象

JS没有真正的数组,只是用对象模拟数组

典型的数组:
1. 元素的数据类型相同
2. 使用连续的内存存储
3. 通过数字下标获取元素

JS的数组:
1. 元素的数据类型可以不同
2. 内存不一定是连续的(对象是随机存储)
3. 只能通过字符串下标获取元素,这意味着数组可以有任何key

//定义一个数组对象
let arr=[1,2,3]
let arr=new Array(1,2,3)  //元素为1,2,3
let arr=new Array(3)  // length为3
arr1.concat(arr2) // 合并两个数组得到新数组
//转化
let arr='1,2,3'.split(',')
let arr='123'.split()
Array.form('123')
//截取
arr1.slice(1)  //从第二个元素开始
arr1.slice(0)  //截取所有元素,可用来复制数组
//JS只提供浅拷贝

增删改查 数组中的元素

注意:1.用delete删,数组长度不会变短,成为稀疏数组,2.不要随便改数组的length,会连带删掉元素
* 删

arr.shift() //删掉头部元素,并返回删掉的元素
arr.pop() //删掉尾部元素,并返回删掉的元素
arr.splice(index,1) //删除index的一个元素
arr.splice(index,1,'x') //并在删除位置添加'x'
arr.splice(index,1,'x','y') //并在删除位置添加’x‘,'y'

* 查

let arr=[1,2,3,4,5]
arr.x='xxx'
Object.keys(arr) //查看所有属性名
for(let key in arr){console.log(`${key}:${arr[key]}`)} //查看所有key和value

//伪数组
let divList=document.querySlectorAll('div')
伪数组的原型链中没有数组的原型
没有数组公用属性的数组就是伪数组

数组数组对象共用属性 'push' / 'pop' / 'shift' / 'unshift' / 'join' 详细用法参考MDN

函数对象

//定义一个函数对象
function fn(x,y){ return x+y }
let fn2 = function fn(x,y){ return x+y }
let fn =(x,y)=>x+y
let fn =new Function('x','y','return x+y')

函数自身属性:name和length
函数共有属性:'call' / 'aplit' / 'bind'等等

{{topic.upvote_count || 0}}

new X()自动做的四件事:

  • 自动创建空对象
  • 自动为空对象关联原型,原型的地址指定为X.prototype
  • 自动将空对象作为this关键字运行构造函数
  • 自动 return this
    ————JS之父的爱?

构造函数X

X本身负责给对象本身添加属性
X.prototype对象负责保存对象的共有属性

代码规范

  • 所有构造函数(专门用于创造对象的函数)首字母大写
  • 所有被构造出来的对象首字母小写
  • new后面的函数使用名词形式(如new Person(),new Object()),其它函数一般用动词开头

原型公式

对象.__proto__===其构造函数.prototype

类 vs 类型

  • 类是针对于对象的分类,有无数种类
  • 类型是JS数据的分类,有7种:四基两空一对象

爸爸在哪?

  • window的爸爸是Window
    可通过constructor属性看出构造者
  • window.Object的爸爸是window.Function
    因为所有函数都是window.Function构造的
  • window.Function的爸爸是window.Function
    浏览器构造了Function然后指定它为自己的构造者

class vs 原型

ES6引入了新语法class
原型和类都是用来给对象分类的,两种写法都需要掌握

构造函数写法如下:

function Person(name,age){
this.name=name;
this.age=age;
}
Person.prototype.sayHi=function(){
console.log("你好,我叫"+person.name)
}
let person = new Person('frank', 18)
person.name === 'frank' // true
person.age === 18 // true
person.sayHi() // 打印出「你好,我叫 frank」

class写法如下:

class Person {
constructor(name,age){
this.name=name;
this.age=age;
}
sayHi() {
console.log("你好,我叫"+person.name)
}
}
let person = new Person('frank', 18)
person.name === 'frank' // true
person.age === 18 // true
person.sayHi() // 打印出「你好,我叫 frank」

数组对象

JS没有真正的数组,只是用对象模拟数组

典型的数组:
1. 元素的数据类型相同
2. 使用连续的内存存储
3. 通过数字下标获取元素

JS的数组:
1. 元素的数据类型可以不同
2. 内存不一定是连续的(对象是随机存储)
3. 只能通过字符串下标获取元素,这意味着数组可以有任何key

//定义一个数组对象
let arr=[1,2,3]
let arr=new Array(1,2,3)  //元素为1,2,3
let arr=new Array(3)  // length为3
arr1.concat(arr2) // 合并两个数组得到新数组
//转化
let arr='1,2,3'.split(',')
let arr='123'.split()
Array.form('123')
//截取
arr1.slice(1)  //从第二个元素开始
arr1.slice(0)  //截取所有元素,可用来复制数组
//JS只提供浅拷贝

增删改查 数组中的元素

注意:1.用delete删,数组长度不会变短,成为稀疏数组,2.不要随便改数组的length,会连带删掉元素
* 删

arr.shift() //删掉头部元素,并返回删掉的元素
arr.pop() //删掉尾部元素,并返回删掉的元素
arr.splice(index,1) //删除index的一个元素
arr.splice(index,1,'x') //并在删除位置添加'x'
arr.splice(index,1,'x','y') //并在删除位置添加’x‘,'y'

* 查

let arr=[1,2,3,4,5]
arr.x='xxx'
Object.keys(arr) //查看所有属性名
for(let key in arr){console.log(`${key}:${arr[key]}`)} //查看所有key和value

//伪数组
let divList=document.querySlectorAll('div')
伪数组的原型链中没有数组的原型
没有数组公用属性的数组就是伪数组

数组数组对象共用属性 'push' / 'pop' / 'shift' / 'unshift' / 'join' 详细用法参考MDN

函数对象

//定义一个函数对象
function fn(x,y){ return x+y }
let fn2 = function fn(x,y){ return x+y }
let fn =(x,y)=>x+y
let fn =new Function('x','y','return x+y')

函数自身属性:name和length
函数共有属性:'call' / 'aplit' / 'bind'等等

72
回复 编辑