Bir Koşuldan Önce Regex İfadesi Alın

Question 1

Regex ifadelerine dayanarak aşağıdakileri çıktılamak istedim. Dosya adı formatlarına göre bir çeşit yeniden kullanılabilirliğe sahip olmak istedim

Dosya adı biçimleri

   export const datas = [
      {
        id: 1,
        name: "CODE_SLOT",
        codePosition: 0,
        codeType: "_",
        slotPosition: 1,
        slotType: "_",
      },
      {
        id: 2,
        name: "CODE-SLOT",
        codePosition: 0,
        codeType: "-",
        slotPosition: 1,
        slotType: "-",
      },
    ];

Ürün kodu kodu

export const getProductCode = (code, codePosition, codeType) => {
  return (
    code.replace(/\.[^/.]+$/, "").split(codeType)[codePosition] ||
    code.replace(/\.[^/.]+$/, "").split(codeType)[0] ||
    ""
  );
};



const images = [{
    name: "toys-blue_wide.jpg"
}]

const selectedFileNameFormat = datas[0]

const output = images.map((image) => ({
  productCode: getProductCode(
    image?.name,
    selectedFileNameFormat?.codePosition,
    selectedFileNameFormat?.codeType
  ),
}));

console.log(output)

Ürün Kodu için Beklenen Çıktı

productCode: toys-blue

Yuva kodu

export const getSlot = (slot, slotPosition, slotPosition) => {
  return (
    slot.replace(/\.[^/.]+$/, "").split(slotPosition)[slotPosition] ||
    slot.replace(/\.[^/.]+$/, "").split(slotPosition)[0] ||
    ""
  );
};
    const images = [{
    name: "toys-blue_wide.jpg"
}]
const selectedFileNameFormat = datas[0]

const output = images.map((image) => ({
  slotCode: getSlot(
    image?.name,
    selectedFileNameFormat?.codePosition,
    selectedFileNameFormat?.codeType
  ),
}));

Yuva için beklenen Çıktı

slotCode: wide

Question 2

Sorunuzu doğru anladıysam, bir dizeden ayrıştırmak/ayıklamak istersiniz, yani " toy-blue_wide.jpg", a productCode her şey önce bu "_" karakter, yani "toy-blue" ve bir slotCode her şey sonra bu "_" dosya uzantısı hariç. Tek bir REGEX kullanabilir ve bu iki parçayı kendi gruplarına ayırabilirsiniz.

/^(.*)_(.*)\./

İlk parens ürün kodunu, ikincisi yuva kodunu yakalar. RexExp kullanarak.prototip.exec her dosya adı üzerinde bir arama yapabilir ve bir dizi eşleşme ayıklayabilirsiniz.

const [, productCode, slotCode] = /^(.*)_(.*)\./.exec(name);

Ayrıca, dizi imha atamasını kullanırken ilk öğeyi atladığımıza dikkat edin. İlk öğe iade gelen olmasıdır .exec dizin 1 ise, eşleşen karakterlerin tam dizesidir..n yakalanan gruplardır.

const images = [{
  name: "toys-blue_wide.jpg"
}];

const codeAndSlotRegex = /^(.*)_(.*)\./;

images.forEach(({ name }) => {
  const [, productCode, slotCode] = /^(.*)_(.*)\./.exec(name);
  console.log({ productCode, slotCode });
});

Güncelleme

Dosya adı ayrıştırıcısını dinamik olarak seçmeye izin vermek için, ayrıştırmak istediğiniz her format için belirli bir REGEX eşleştiricisi belirtirdim.

const fileNameFormats = [
  {
    id: 1,
    name: "Code-Slot",
    matcher: /^(.*)-(.*)\./
  },
  {
    id: 2,
    name: "Code_Slot",
    matcher: /^(.*)_(.*)\./
  }
];

Görüntü dizisi üzerinde yineleme yapın ve özel olarak seçilen eşleştiriciyi kullanın. Eşleşmenin başarısız olması durumunda bir geri dönüş dizisi değeri ve varsayılan kod ve yuva değerleri sağlayın.

const output = images.map((image) => {
  const [, productCode = "", contentSlot = ""] = selectedFileNameFormat.matcher.exec(
    image?.name
  ) ?? [];
  return {
    productCode,
    contentSlot
  };
});

Drew Reese · Answer 1 · 2021-11-23T07:35:59

Sorunuzu doğru anladıysam, bir dizeden ayrıştırmak/ayıklamak istersiniz, yani " toy-blue_wide.jpg", a productCode her şey önce bu "_" karakter, yani "toy-blue" ve bir slotCode her şey sonra bu "_" dosya uzantısı hariç. Tek bir REGEX kullanabilir ve bu iki parçayı kendi gruplarına ayırabilirsiniz.

/^(.*)_(.*)\./

İlk parens ürün kodunu, ikincisi yuva kodunu yakalar. RexExp kullanarak.prototip.exec her dosya adı üzerinde bir arama yapabilir ve bir dizi eşleşme ayıklayabilirsiniz.

const [, productCode, slotCode] = /^(.*)_(.*)\./.exec(name);

Ayrıca, dizi imha atamasını kullanırken ilk öğeyi atladığımıza dikkat edin. İlk öğe iade gelen olmasıdır .exec dizin 1 ise, eşleşen karakterlerin tam dizesidir..n yakalanan gruplardır.

const images = [{
  name: "toys-blue_wide.jpg"
}];

const codeAndSlotRegex = /^(.*)_(.*)\./;

images.forEach(({ name }) => {
  const [, productCode, slotCode] = /^(.*)_(.*)\./.exec(name);
  console.log({ productCode, slotCode });
});

Güncelleme

Dosya adı ayrıştırıcısını dinamik olarak seçmeye izin vermek için, ayrıştırmak istediğiniz her format için belirli bir REGEX eşleştiricisi belirtirdim.

const fileNameFormats = [
  {
    id: 1,
    name: "Code-Slot",
    matcher: /^(.*)-(.*)\./
  },
  {
    id: 2,
    name: "Code_Slot",
    matcher: /^(.*)_(.*)\./
  }
];

Görüntü dizisi üzerinde yineleme yapın ve özel olarak seçilen eşleştiriciyi kullanın. Eşleşmenin başarısız olması durumunda bir geri dönüş dizisi değeri ve varsayılan kod ve yuva değerleri sağlayın.

const output = images.map((image) => {
  const [, productCode = "", contentSlot = ""] = selectedFileNameFormat.matcher.exec(
    image?.name
  ) ?? [];
  return {
    productCode,
    contentSlot
  };
});

@ Joseph Bilmiyorum, bu diğer yazı gerçekten hiçbir şeyi açıklamıyor ve tüm codesandbox'ın yaptığı iki seçenek arasından seçim yapmak ve yerel durumu günlüğe kaydetmek. Bundan ne anlamamızı istediğinden emin değilim.
@ Joseph Tamam, ama seçeneklerin ne anlama geldiğini soruyorum. Kullanıcı "Kod Yuvası" nı seçerse, bundan sonra ne olması gerekiyor, bu seçeneğin seçilmesi ne anlama geliyor? Kullanıcı "Code_Slot" u seçerse aynı şey olur mu? Ayrıştırmak için bir dosya adı biçimi seçmek istediğini sanıyordum. Kelimenin tam anlamıyla "kod" ve "yuva"arasındaki sembolü bölmek kadar basit mi?
@ Joseph Şimdi görüyorum. Cevabı buradan güncelleyeyim mi?

Bir Koşuldan Önce Regex İfadesi Alın

Soru

En iyi cevabı

Güncelleme

Diğer dillerde

Bu sayfa diğer dillerde

Bu kategoride popüler

Popüler soruları bu kategoride