Javascipt基础
javascript 对象赋值
传统模式
javascript 调试
在控制台打印输出调试函数
// 自定义调试函数
window.debugLightbox = {
showAllImages: function() {
console.log('显示所有图片:');
const images = Array.from(document.querySelectorAll('img')).map((img, i) => {
return {
index: i + 1,
src: img.src,
alt: img.alt || null,
visible: img.offsetParent !== null,
width: img.naturalWidth,
height: img.naturalHeight
};
});
console.log('图片信息列表:', images);
return images;
},
fixImage: function(selector) {
const img = document.querySelector(selector);
if (img) {
const oldSrc = img.src;
// 添加时间戳以避免缓存
img.src = oldSrc + '?t=' + new Date().getTime();
console.log('修复图片:', oldSrc, '->', img.src);
} else {
console.log('未找到图片:', selector);
}
},
openImage: function(path) {
const absoluteUrl = new URL(path, window.location.origin).href;
console.log('直接打开图片:', absoluteUrl);
previewImage(absoluteUrl, path.split('/').pop());
},
deviceInfo: function() {
console.log('设备信息:', {
isMobile,
isTablet,
isTouchDevice,
userAgent: navigator.userAgent,
screenWidth: window.screen.width,
screenHeight: window.screen.height,
viewportWidth: window.innerWidth,
viewportHeight: window.innerHeight
});
}
};
// // 在控制台中调用
// window.debugLightbox.deviceInfo();
// const imgs = window.debugLightbox.showAllImages();
// console.table(imgs);
javascript 对象字面量
- 对象字面量是用花括号 {} 直接定义对象的一种语法形式,它是一种字面量表达式，即在代码中直接写出对象的内容，而不是通过 new Object() 或构造函数创建.
- 对象字面量是引用类型，即对象名是一个指针，当你把对象名赋值给另一个变量时, 对新变量所做的修改会影响源对象.
示例1
示例2
/ 定义一个对象字面量
let person = {
name: "Edward",
age: 30,
skills: ["PLC", "JavaScript", "Translation"],
greet() {
console.log("Hello, my name is " + this.name);
}
};
person.greet(); // 输出: Hello, my name is Edward
var obj={
id:123
};
var b=obj;
b.id=456;
console.log(obj.id); //456