当前位置： 首页>后端>正文

创建数组的几种方式？

后端2024-10-23 01:20:23

一省：HTML

17. BOM和DOM是什么？

  1. BOM：浏览器对象模型(Browers Object Model)允许JavaScript与浏览器对话。通过BOM的对象和方法可以完成对浏览器窗口的操作，如控制窗口及弹窗、通过location对象可以获取页面信息、通过navigator对象了解浏览器、通过history对象操作浏览器历史等。BOM的核心是window对象。
window.close();//关闭浏览器
window.alert("notice!");//弹窗提示
console.log(window.location);//当前网页的信息
window.location.href = "http://123.cm" //跳转网页
console.log(window.navigator);//当前浏览器的信息
console.log(window.innerHeight);//浏览器窗口的内高度
console.log(window.innerWidth);//浏览器窗口的内宽度
window.history.go(-1);//倒退一页
...
  1. DOM: 文档对象模型(Document Object Model)，通过DOM的对象和方法可以完成对网页中元素的增删改，让网页产生动态效果。DOM的核心是document对象，document属于window，所以BOM是包含DOM的。
//查找元素
let element = document.getElementById("app");//获取id为app的元素

// 改变元素
element.innerHTML = `<p>改变的内容</p>`

// 创建和删除元素
document.createElement(element)
document.removeChild(element)

// 添加事件
element.onclick = function(){ code }

这些都是操作DOM元素。

二省： CSS

17. css3弹性盒子

  1. 弹性盒子是 CSS3 的一种新的布局模式。CSS3 弹性盒（ Flexible Box 或 flexbox），是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。
  2. 常用属性
属性 描述
display 指定 HTML 元素盒子类型，属性的值为 flex 或 inline-flex将其定义为弹性容器
flex-direction 指定了弹性容器中子元素的排列方式
justify-content 设置弹性盒子元素在主轴（横轴）方向上的对齐方式。
align-items 设置弹性盒子元素在侧轴（纵轴）方向上的对齐方式。
flex-wrap 设置弹性盒子的子元素超出父容器时是否换行。
align-content 修改 flex-wrap 属性的行为，类似 align-items, 但不是设置子元素对齐，而是设置行对齐
flex-flow flex-direction 和 flex-wrap 的简写
order 设置弹性盒子的子元素排列顺序。
align-self 在弹性子元素上使用。覆盖容器的 align-items 属性。
flex 设置弹性盒子的子元素如何分配空间。

三省：JavaScript

17. 创建数组的几种方式？

1. 构造函数创建

let arr = new Array()

利用构造函数创建数组时，可以传参数。如果传一个参数并且是数值类型的话，那么就会创建一个length等于这个数字的数组。

let arr = new Array(20)
console.log(arr);//[空属性 × 20]

如果传了一个或多个其他类型的参数，就会创建一个包含这些参数的数组。

let arr = new Array("a")
console.log(arr);//['a']
//new 可省略
let arr1 = Array(100,"str", null, undefined, {})
console.log(arr1);//[100, 'str', null, undefined, {}}]

2. 数组字面量创建

// 字面量创建
let arr = [1, "2", [null, undefined]]
console.log(arr);//[1, '2', [null, undefined]]

3. ES6转化数组方法

  • Array.from()
    是把类数组或有length属性的元素转换成数组 
    // 把字符串拆分成数组
let arr = Array.from("Str")
console.log(arr);//['S', 't', 'r']

// 把arguments对象转化成数组
function args() {
 console.log(arguments);//Arguments(3) [1, '2', null, callee: ?, Symbol(Symbol.iterator): ?]
 console.log(Array.from(arguments));//[1, '2', null]
}
args(1, "2", null)

// 可以转化带有必要属性的自定义对象，对象以下标为键名
let arr1 = Array.from({
 0: "Jason",
 1: "Marry",
 2: "Bob",
 length: 3
})
console.log(arr1);
  • Array.of() 可以把一组参数转化成数组。 
    // Array.of()
 let arr = Array.of(1, 2, 3)
 let arr1 = Array.of(null)
 let arr2 = Array.of(undefined)
 console.log(arr, arr1, arr2);//[1, 2, 3] [null] [undefined]

https://www.xamrdz.com/backend/3r51997280.html

相关文章：